Adze & Sherry: Foodie Fanatic
As project manager and content strategist for the design group Adze & Sherry, I led the redesign process for the Foodie Fanatic e-commerce website and conducted our pitch presentation for the business proposal.
Design deliverables included business strategy, project plan/budget, user profiles, sitemap, wireframes and taxonomy. I also designed the Adze & Sherry logo representing our firm.
PROJECT MANAGEMENT, E-COMMERCE DESIGN, USER PROFILES, WIREFRAMES, TAXONOMY
Redesign Proposal for E-commerce Site
Project Manager, Content Strategist
SWOT Analysis, User Profiles, Wireframes, Responsive Design
Step 1: Business Strategy
For this project, we were given a packet of user research documents about the Foodie Fanatic website being redesigned from which to develop our business strategy. Our vision was that Foodie Fanatic needed to create a space to inspire, educate and equip food lovers. Their mission should be to become the one-stop resource for all things "Foodie:" to engage customers in a community of food lovers, to connect them to culinary experts, and to promote Foodie Fanatic products in the process.
We manifested our vision and mission in a content strategy that sought to engage users by allowing them to contribute to Foodie Fanatic content, and give them a sense of ownership over the site by providing incentives or rewards for generating quality content. Key to accomplishing both of these tasks is creating an effective labeling/navigation hierarchy and metadata schema.
Step 2: Project Plan
In developing our project plan, we created a project timeline indicating the team leads for each deliverable, grouping them into four phases. We established a budget based upon the number and complexity of deliverables included in each phase, and included a contingency fund to account for extensions to any of the project phases.
Step 3: User Personas
In designing our user personas, we began by identifying four user types representing a spectrum of engagement habits or socio-economic status and the different content types that any user may interact with on the site. Arranging these on a grid, we then notated which of the content types would be most important to each persona according to their user needs. We also included a column describing each content type, using icons to visually represent each user type.
With our user needs identified, we began fleshing out each persona type with a user profile. Our user types allowed us to derive the information needs and frustrations of each persona from their content preferences, and enabled us to infer their preferred brands and devices. For each user persona, we tried to come up with sample quotes that would distill their impressions of interacting with the site being redesigned in just a few sentences.
Step 4: Sitemap
Developing our sitemap for Foodie Fanatic in Slickplan was a critical first step to the creation of our wireframes. Separating out our main navigation from our user profile portal and footer navigation, we divided our navigational structure into content types, emphasizing user engagement and interaction with things to do rather than product type. Each of these aspects of our navigational structure led to important considerations related to the organization and layout of our wireframes.
Step 5: Wireframes
With out sitemap laid out, we set about designing our wireframes. In keeping with our focus on content type rather than product listings, we created a responsive design that would highlight individual articles featuring one or more products. Users had the option to scroll right and left between articles as well as up and down, and if one chose not to utilize the search or category navigations at the top of the homepage, clicking on one of the images would bring them to an individual article's page.
An article page may be a written recipe with accompanying video, a written editorial, or a user-generated blog post. Article pages include text, image, and video detailing a recipe or story, along with metadata related to the article made use of by search or category. Each article page would also contain sidebar links to individual products featured within the article, or other articles related by metadata.
Individual product listing pages allow users to view items from multiple angles alongside product descriptions, user comments, ratings and product metadata. Sidebar widgets provide product pricing and shopping cart functionality, along with related advertisements and articles featuring the product, continuing the user journey.
On Wireframing Responsive Designs... (Correctly)
As project manager, it was up to me to ensure that our wireframes were valid responsive designs. Having a background in web development and being able to visualize the way block, inline and inline-block structural elements work together enabled me to see how the order of objects in my team members' wireframes wouldn't function responsively when coded. It is crucial for at least one member of the design team to be able spot these sorts of errors before they are sent to developers, especially when it comes to wireframing responsive designs.
Step 6: Taxonomy
We developed our taxonomy in both a detailed Excel spreadsheet as well as a visual hierarchy using Slickplan. Our taxonomy laid out our product listing categorization as well as our content inventory categories, allowing for metadata that organized Foodie Fanatic article content in addition to the products featured therein.