Allrecipes is the #1 ranking most popular social networking recipe sharing website. The company is based in Seattle, WA and traffics an estimated 25,000,000 unique monthly visitors. The business originated in 1997 and now operates 19 websites in 13 languages. Allrecipes.com's smartphone apps allow users to access the site and its user-uploaded content while on the go.
Site map & User Flows
Wireframes & Iterations
Visual Design & Prototype
I created a survey containing 9 multiple choice questions to discover peoples cooking habits
I posted the survey on Facebook. My teammates likewise posted it on their social media outlets
35 people participated providing solid pool of data
This survey provided us demographics of our most likely users
Most people used websites instead of mobile apps
Ironically most people showed a willingness to use mobile a app
We investigated why people used websites over mobile apps
Scrolling between ingredients and directions was a big issue
We tried to adopt things not available on mobile
In Person Interviews
The primary persona is Trevor Parker, a 35 year old engineer living in downtown Seattle with his girlfriend. The couple used to go out to eat a lot, but are now trying to cook more at home to save money. Trevor doesn't eat gluten because of a recently discovered gluten intolerance, and his girlfriend is a vegetarian. Trevor is looking for simple recipes he can cook at home that will accommodate both their diets. He has downloaded the Allrecipes app but is finding the search features to be pretty limiting. Furthermore, once he gets to a recipe he wants to make, he has to scroll back and forth on his screen several times to reference the ingredients list and instructions. It's annoying, and his hands are often dirty from cooking so his phone gets smeared.
Identified 4 of our strongest competitors
Ironically Pinterest was the biggest
We discovered Allrecipes already incorporated most features
Emphasis shifted from keeping up with the other apps to improving existing features and distinguishing ourselves
We added voice activation to separate us from our competitors
Wrote down common responses people gave to questions on post it notes
Grouping these responses based on similarities helped us notice trends
We identified the most common reoccurring problems
Prioritized the most prominent complaints as our design focus
Left Photo) Adding lower navigation bar and putting lesser used features in hamburger menu was easier to psychologically process.
Middle Photo) People had difficulty noticing that items were being added to shopping cart until a prompt over the cart icon would indicate it.
Right Photo) Selecting between ingredients and directions by tapping solved the complaint of having to scroll up and down between the two.
Research the complaints people are having with Alexa's narration of recipes and solve those problems.
Our teammates expressed regret not having more time to work on the visual design. Doing so would also require more testing after.
What I learned
Always practice humility and acknowledge when other teammates have a better idea
Let usability testing indicate what the best design is over another
What seems intuitive to the designer may not be intuitive to other users
This project ended up being great experience in many ways. No matter how large a company is, it does not mean their web, or software design is beyond critique or attempts at making improvements. In the end, we were able to complete a design that improved its functionality and had been successfully tested for its ease in use. We also successfully added a voice activation feature that gave the app a competitive edge against other apps, setting them apart, which would enable them to remain competitive in the market place.