A blue skies UI project for the Writers of Verblio
I worked on the ‘create content’ project at Verblio, a SaaS startup connecting freelance writers with small business owners and agencies who needed outsourced content. This project was a full redesign of the most used page of the writers side of the app - the content creation tool.
Role: UX Designer
Timeframe: 2021-2022
Methods & Tools: Productboard; Pendo; Fullstory; Usability Testing
The problem
The create content page was also one of the oldest pages on the app. It was built on old code that was hard to work with. As a result, tweaks were made here and there, and new features were added in as they fit, but the page was long overdue for an overhaul.
The catalyst for the redesign was when a number of writers began complaining that the autosave feature was malfunctioning. Writers began to lose faith in the page and turned to writing off platform. This, in turn, made it very difficult for Verblio to track the status of a piece of content.
The goal
Verblio wanted to get writers back on platform so they could improve their data tracking. The dev team would be in charge of making sure autosave was bulletproof in the backend. To do so, they would build the page from scratch. From a design perspective, this was an opportunity to uncover what other pain points writers were experiencing and design a solution that would make their jobs easier, and maybe even more fun. 😉
Discovery
I started the discovery phase of this project by using three product engagement tools to better understand writer pain points. Using product engagement tools as research aids is a great way to quickly and cheaply attain a wealth of user insights.
Productboard
Productboard is a product management tool that helps you understand and prioritize user needs. You can funnel user insights into Productboard from sources like customer service tickets, emails, or Slack threads.
Productboard insights
Autosave was not reliable
It was difficult for writers to find and fix validation errors
Writers couldn’t tell which type of English the customer wanted
Writers were missing key business information
The page was not intuitive for first-time visitors
Pendo
Pendo is a product analytics app that helps you assess product engagement. You can tag each element on a page, and then track a variety of metrics. I used Pendo’s heatmap feature to identify high-click areas of the Create Content page. This information shaped the information architecture of the new design.
Fullstory
Fullstory is a session-recording software that allows you to watch users complete key user flows. I was able to see how writers were interacting with the Create Content page.
Fullstory insights
Verified writers writing off platform and pasting into the Verblio text editor.
Writers spent a lot of time vertically scrolling between the business information at the top of the page and the text editor at the bottom.
Writers used the text editor as ‘scratch paper’ - a place to keep notes and to-do lists for themselves.
In addition to the core writing feature of this page, writers came to this page to complete a completely separate task: assessing the competition and selecting a job.
Design
I moved into the design phase with a better picture of writer pain points and opportunities for improvement.
Let’s take a closer look at one of my design objectives - differentiating the task of writing from the task of selecting a job. I wanted to make writing the main focus of this page. Ideally, writers would come to this page and have access to all of the information that they needed, but would not feel bombarded with this information while they tried to get their creative juices flowing. I initially tried four different layouts.
Click on the layout to see it bigger!
Split page layout
Tab layout
Pop out layout
New window layout
I ultimately went in the direction of the new window layout. This gave the writer a page dedicated to the task at hand. However, it was important that the writer would still have easy access to all of the request details and business information. I added this information back into the design by using a sliding drawer. When opened, the writer would have access to all of the information they previously had to vertically scroll to find. In the new design, the writer would have easy access and would not lose their place while writing.
Usability testing
I conducted four usability tests to assess writers’ ability and enjoyment in using the new create content page. Usability tests were conducted virtually using Zoom, Figma, and Otter.ai.
Overwhelmingly, participants were incredibly enthusiastic about the changes I had made. The consensus was that the changes would make their jobs easier and more efficient.
“It looks like y’all are striving really hard to make the writer’s experience easier.”
“Oh my god I love this. PLEASE make this permanent.”
I also caught a few sticky points before the dev team began to build! Through usability testing, I identified some icons and copy that were ambiguous, some text that was too small, and a few functionality tweaks that would make a big difference for the writers.
Reflection
I wrapped up the create content designs in September of 2022 with handoff to dev. The project is expected to go live Winter of 2023! If I were to do the project again, I would have added in writer interviews prior to beginning the designs. I learned a ton of useful information through my product engagement tool research, but it would have been great to learn more about writer motivations before choosing a direction for the designs.
Of my original design objectives, I did not fully address in v1 providing the writers with a place to take notes. I would love to explore this ‘scratch paper’ concept further in a future iteration.