Mostly Well Blog Design & User Research
As my full-time job has evolved into a cross-functional leadership role, I’ve started to miss the time I used to spend on creative work. And even when I did previously spend more time on design work, I still craved creative projects that I had ultimate control over, that could remain uninfluenced by someone else’s vision or even a client’s preferences.
In addition, the pandemic has afforded me extra time to think about what really matters to me. As we collectively face the trauma of death, illness, job losses and broken businesses, I expect that many of us have asked ourselves what truly matters, and how we might be living our lives in a way that protects what we care about most.
I care about health and wellness because I recognize that health is a privilege not everyone is afforded, and a healthy body allows me to engage in life more fully. In my journey to optimize my health and wellness, I’ve trained at various gyms in Austin, researched nontoxic cosmetics, increased my intake of fruits and vegetables, learned to sleep better, and prioritized my mental health. By taking care of my body and mind, I’ve been able to do everything else in life better and with more intention. I’ve even been able to generate and nurture my ideas more effectively, reviving my creative side.
My blog Mostly Well is a marriage of my interest in wellness with my desire to express myself creatively (in this case through writing, cooking, photography, and the design of the blog). It’s a passion project, and because I’m combining my top interests, I’ve got dozens of ideas for new content and can’t wait for the site to launch. Read about the steps I took to plan the site below.
Information Architecture
I’ve had the idea for this blog for about a year and had planned to cover my fitness journey, but I needed to get clear on the full scope of content I wanted to include before I went any further. After some reflection I decided to expand my topics to also include general wellness and food. I outlined the site navigation below, so I could begin to conceptualize the branding and layout. Not all of these subcategories show up on the site yet, but I will add them as I write articles that correspond to these topics.
Branding
On Pinterest, I collected inspiration from personal training and gym websites. I liked the bold, high-contrast look of these sites and felt it would be appropriate for content about my boxing training. However, an overly aggressive brand wouldn’t align well with some of the other content I planned to post about, like smoothie recipes and clean beauty products. I also didn’t want to give the impression that I was a trainer; I wanted people to feel as though they were joining me on my personal journey. I needed a brand that balanced boldness with natural, clean living, and inspired rather than intimidated people. That’s how I arrived at deep, dark blues and the bold Bree font, balanced with vibrant yellow, natural beige and the modern Futura.
I chose the name Mostly Well because “Well” is general enough to encompass all the topics I plan to discuss (fitness, food, mental health, etc.). It’s “Mostly” well because I don’t adhere to impossible diets or fitness routines—it’s still important to me to embrace the pleasures in life that are shunned by ascetic health gurus. As I state in my blog, my journey is not about being a perfect person, it’s about respecting my body as the vehicle that allows me to experience the great things life has to offer.
I’m not much of a logo designer, so the logo is something I plan to have redesigned, but for now, it satisfactorily conveys what my brand is about.
I wanted the site’s photos to be high-contrast with mostly dark backgrounds, but not so moody that images of fresh fruits and vegetables felt out of place. Portraits have long been my strong suit in the realm of photography, so learning about food and product photography has been a fun new challenge for me.
Design
After I’d settled on my branding, it was time to start sketching. I’m rapidly losing my ability to neatly sketch, but even if you’re bad at sketching, it’s still a useful tool for getting your ideas out on the table.
Benjamin Franklin said, “An ounce of prevention is worth a pound of cure.” I think of this when I’m designing, because ideation, research and planning is what saves designers and developers from costly development rework in the future. The time I put into my information architecture, brand guidelines, quick sketches, and inspiration collection helped crystallize my vision for the site and made it easier for me to create mockups quickly, and this level of preparation also made it easier to work with the developer on building out the Squarespace site. Check out some mockups I compiled for key layouts of the site.
Development
I knew I wanted to use Squarespace for my blog, as I’m using it for other sites including this one. Squarespace sites can be customized by talented developers, but the content can of course be easily updated without any coding. I had success working with Nikki Fanshaw on my photography site a few years ago, so I re-hired her to build my blog in accordance with the designs I created. (I recommend her if you’re looking for a Squarespace designer or developer—she does both capably.)
I provided the designs to her, and we had a few rounds of revisions based on the user testing I conducted, as well as some of her own creative ideas for how to maximize the capabilities of Squarespace.
User testing
Normally I would conduct user testing on a prototype that I had created with a design tool, or at least do user interviews before beginning a design. However, because this project is more for myself than anyone else, and because I have limited time with my day job, I decided it would be more efficient to conduct a brief round of testing after Nikki’s first buildout of the site. Our contract allowed for two rounds of revisions, so I knew I could incorporate any changes into the second iteration of the site.
I compiled a script for my user testing sessions and interviewed three people that fit the profile of my target audience: women over 25, interested in healthy food and fitness. I used Zoom to remotely watch them perform tasks on the site, to uncover any usability issues and get their general perceptions of the design.
As always, my user research uncovered interesting perceptions and ideas. I found that my busy participants wanted concise, highly visual content that got straight to the point, and I found that Instagram was the primary way they consumed information online. There were some minor usability issues—for example, they looked to the footer for a way to contact me, but there was nothing about the design that prevented them from succeeding at the user testing tasks. The most useful information I received was about the type of content they found valuable, and the avenues through which they preferred to receive that content. For details on my findings, read the full user testing report.
Final Revisions
Below, you can see how the design of the homepage in particular changed as a result of my user research and testing. I made my Instagram feed a more prominent section of my site and intend to be more active on Instagram going forward, knowing that my target audience uses Instagram frequently. I added the ability to contact me and sign up for my email newsletter in the footer. I shortened the header and three main boxes, which were taking up too much space on the small screens of my users. I cleaned up the mobile footer, which was a little misaligned in the first iteration of the site. After a few rounds of iterations, I’m really happy with the site and can’t wait to add more content.
