Small business owners need a simple, quick, and effective way to sell their products on multiple platforms because it is too expensive, timely, and overwhelming to market on each platform separately.
With SellHub, small business owners can sell on multiple platforms at once.
We researched our target audience by conducting user interviews and digging into the world of owning an online small business. From this, we were able to create empathy maps to outline our user's actions, thoughts, and feelings.
Based on our empathy maps, we created personas to further build empathy and visualize who we're designing for.
We conducted a Crazy 8s exercise where we were able to quickly ideate possible wireframes for the app. We took pictures of our work and uploaded them to a Figma document, where we discussed which elements from each teammate's sketches worked best.
Taking our ideation from this exercise, we were then able to narrow down our low fidelity wireframes. I sketched out the final layout based off everyone's ideas and our discussion.
It was time to check in with users to make sure we were on the right track. We conducted two A/B tests.
Our main focus when moving toward the medium fidelity design was the Create Post process of the app. We wanted to test whether breaking down the process into a guided step-by-step would make the posting process a more pleasant user experience.
Test B was the winner of the AB test due to participants saying that is "flows better," "looks nicer without a dropdown", and "has a nicer layout".
During a peer critique session, our class noted that they were unsure where the back arrow would take them. We suspected that this was because the header titles were left-aligned, and as a result, the titles were perceived as the name of the previous page. Therefore, we hypothesized that centering the headers would communicate to the user that the header title was the name of the current page, and so the information architecture would be clear.
Test A was left-aligned, and Test B was center-aligned.
The success rate of Test A was 33%, while the success rate of Test B was 100%. Therefore, we concluded that centered header title text should be used.
Taking in our peer feedback and our research, we took the insights we learned in the first iteration to put together a medium fidelity prototype in Figma.
Our team hypothesized that our target audience would prefer using this app in dark mode. We needed to validate this assumption. I surveyed 7 small business owners to figure out if we should be designing this app in light mode or dark mode.
Based off the results of this survey, the answer was clear. Our assumption was validated, and we decided to focus on designing our mockups in dark mode.
As designers, we're constantly growing. The more we create, the more we learn. So it's natural for us to look back at our older designs and see imperfections that we hadn't seen before.
When I saw our prototype after months away from it, I was inspired to redesign the UI with a fresh set of eyes. The result is a cleaner, sleeker prototype.
