Many men dislike shopping. It’s time-consuming, stressful, confusing, and frustrating.
Can we reinvent the experience or offer tools to make shopping better and even fun?
The first step in designing a mobile app is to understand the problem space.
Conducting research and user interviews is critical to being able to empathize with the people who face the challenges the app seeks to solve.
Research uncovered the following eight challenges to be overcome in order to improve men’s shopping:
The Double Diamond is a framework that guides teams to work as a cohesive unit both individually and as a collective.
As can be seen in the diagram, it's organized into two parts, roughly described as research and design. During the 'diverge' component, information and ideas are collected, which are then analyzed and discussed by various stakeholders and decision makers during the 'converge' portion.
For the research and discovery segment of this project, direct user interviews was the method chosen to learn about the user's:
The assumptions the research revelaed must now be tested. A hypothesis statement allows this to happen.
In-person and telephone interviews were conducted with men aged between 25 - 49 in order to learn about their motivations and empathize with their pain points.
Much was learned from the research and interviews with potential users. In particular, this insight was identified as key to the next phase of the design.
Based on the research, this question can be posed:
The persona is a synthesis of the data collected during the user interviews and research conducted.
When a good understanding of the problem space has been achieved, it's time to begin the design process.
This is when we as designers can start to get our hands dirty with creating mountains of sketches, dozens of mockups, and digital prototypes. It's highly satisfying witness the transition from the abstract work of generating low fidelity wireframes to the more refined high fidelity user interface components.
The Double Diamond framework is revisited at this point of the process to guide us through the user interface design phase.
Here, we employ a number or techniques in order reduce the risk of making a mistake that's expensive to fix later on in the process and to maximize usability by experimenting with low fidelity mockups and prototypes.
To approach the problem of men who dislike shopping, the decision was made to focus the intervention on a mobile app. This would allow the user to browse products at their leisure and provide maximum convenience.
During the design ideation phase of this project, rough paper sketches are generated for various screens and interactions. Paper sketches are worth their weight in gold. They allow us to work through ideas quickly. Good ideas can be explored further, bad ones are eliminated.
These were then translated into low fidelity digital mockups.
These digital prototypes—brought to life in Figma—were thoroughly tested by users to determine their strengths and weaknesses. Refinements were then made for subsequent rounds of user testing to analyze.
Here's how the initial Home Screen sketch was realized as a working prototype.
Once a working prototype had been created, prospective users were engaged to evaluate usability of the initial flows.
Testing participants were given the following task to perform:
During the task, users performed some or all of these actions:
During testing, users provided invaluable feedback. Read some key takeaways below.
After the first round of testing, adjustments were made to improve the app's usability. A second round of testing was then conducted.
The goal was to generate a look and feel that would appeal to men in the 25 - 49 age demographic.
The product's tone and aesthetic should exude a modern, stylish, and masculine approach. It must strike a balance between luxurious and casual in order to feel fresh, youthful, and trendy, yet authoritative and trustworthy.
A palette centered on a gold hue comprised of harmonious warm and cool tones.
The name Kit was selected after brainstorming several ideas.
The result of the brand design is a simple geometric logo mark with parallel diagonal lines cutting through the letterforms.
One source of inspiration was angular modern architecture.
How the type was customized.
In addition to the bold and striking buildings pictured above, the shapes, lines, and angles seen in the fixtures at menswear retailers provided further inspiration for the conceptualization.
With the low fidelity prototypes built and tested, and a developing set of brand colours and iconography, the next step is to refine the design aesthetic and polish the user interface.
The next design phase involves taking the low fidelity mockup to the next level and applying the level of detail that makes it feel like a high quality and trustworthy product.
Feel free to take the prototype for a spin!
This app design currently feels very much at home within the iOS ecosystem. With additional time, it would be advantageous to create an alternate version that features the doing language of Google's Android platform.
On balance, I do feel that this app, if carried through to production would be a useful and successful product. That said, it's not a simple proposal. The product database would require a dedicated team to curate, manage, and update.
In addition, during user testing, one participant suggested that the same concept could be ported over to travel. It's an interesting idea, and indicates that the ideas underpinning this product could be applied to a number of verticals.
The problem of solving shopping for men isn't a simple issue. There are a lot of things to consider and despite the presence of shared frustrations, every shopper has unique needs.
During the process, I encountered challenges around some of the features I was looking to build. A major issue was being a little to ambitious and wanting to roll in too many ideas. Ultimately, the product may have suffered from trying to do too much in the allotted time. It would have been a better idea to keep the focus narrow, and add features once the core function was working well.
It's hard to say what the imact of this design intervention is, as it's still just a prototype. I'd like think that if it were to be taken to the next level and built as a fully functional app, that it would be receive popular support and widespread use.
In that case, it would have a beneficial impact of alleviating one of the most frustrating issues that many men face—shopping. Users could gain a new sense of appreciation for their wardrobes and actually come to enjoy browsing for and buying clothes that they find value in.
Some of the things I learned during the process: