Screen+Shot+2019-01-11+at+8.26.55+AM.jpg
 

This project is a work-in-progress! I will be documenting the process. Please scroll down to see User Stories, Information Architecture and screen layouts in development.

 
 

THE BACKGROUND:

I built Coffee Geek as my first full-stack app during General Assembly’s Web Development Immersive.

  • FRONT END: HTML5, CSS3, and JavaScript

  • BACK END: Ruby on Rails, JSON, with CRUD actions to access the SQL database

    It was enthusiastically received so I am developing this project as an ongoing learning experience incorporating user surveys, persona development, user maps, interviews, competitive analysis, information architecture, user interface, wireframing, and prototypes. I hope to one day introduce it as a fully functional app!

THE GOAL:

Create a mobile-first app for coffee aficionados to track coffee bean reviews and coffee tastings.

THE CHALLENGE:

Identifying and understanding potential users, their needs, context, and pain points. Determining the scope of the project,

THE APPROACH:

COLLECT DATA

  1. Conduct interviews with potential users to determine x.

  2. Develop Survey: What are the likes and dislikes, needs, values, context and goals of the Coffee Aficionado

    RESULT (ongoing process): Posted Coffee Connoisseur survey on GA Slack channels and to largest Facebook Coffee group, ‘Coffee, Coffee, Coffee’ (almost 90k members).  Netted a grand total of 3 responses.  Brainstorming to find survey takers. NEXT: post on smaller Coffee FB groups to see if get better response and go to local coffee hangouts to find coffee lovers willing to participate in survey.

    ASSESSMENT: too early to tell

COMPETITIVE ANALYSIS

Conduct a comprehensive review of all apps, blogs, websites, and forums that are potential competitors / are exclusively focused on coffee.

RESULT: a Google spreadsheet cataloguing 54 apps, forums, software, and blogs qualitatively and detailing pertinent information.

ASSESSMENT (in process): Coffee Connoisseur is a viable product. There are apps for professionals, informational sites / apps, but what about for the coffee aficionado who has not made it a full time occupation? 

DATA ANALYSIS

Number of potential users? What will initial scope of product include?

PERSONAS & SCENARIOS

 
First Blush persona study.

First Blush persona study.

 

Will continue to develop and refine Personas as learn more from initial surveys. I will do maps of Persona Journeys to envision and test the flow of how they will interact with the product in the course of a day, identify the ‘Red Routes’ and reverify via prototypes and / or wireframes.

INFORMATION ARCHITECTURE

 
 
Screen Shot 2018-10-23 at 3.59.53 PM.jpg
 

WIREFRAMES

Coffee Geek app screenshots as originally built by me (emphasis in the iteration was on building a full-stack app without focusing on the design of it). The images below are screen shots as the wireframing is very complex.

 
Screen Shot 2018-10-23 at 2.51.13 PM.jpg
 

Updated screenshots for app, now Coffee Connoisseur. Here I have given thought to information architecture, features, priorities, user navigation.

 
coffee connoisseur work in progress.jpg
 

PROTOTYPING I have built the first prototype (still in progress) with Sketch and inVision! Click on this link to view the first iteration of a fully interactive prototype! VIEW PROTOTYPE

Next up: Create the STYLE GUIDE to insure consistency, including:

  • FONTS: sizes, types, usages, weights

  • COLORS: primary, secondary, accent and specific usages

  • LAYOUT GUIDELINES: margins, variations of screen layouts

  • UI ELEMENTS:

    • INPUT CONTROLS: text fields, checkboxes, radio buttons, dropdown lists, list boxes, buttons

    • NAVIGATIONAL CONTROLS: slider, search field, pagination, tags, icons, breadcrumb

    • INFORMATIONAL: progress bar, notifications, message boxes, modal windows

 

PRODUCT TESTING:

Options include watched and unwatched user testing, moderated testing, focus groups, beta testing, A/B testing, and surveys!