Knead Bakery App & Responsive
Project Overview

The Product

A Foot Above is a dedicated mobile app, and responsive website that provides. Families a need of recycled shoes at a very low cost to them if qualified. The typical users are between 18-80. The goal is to understand if our users are having difficulty ordering their recycled shoes from the app

The problem

300 million pairs of shoes go to waste per year in the United States. The strategy behind A Foot Above has identified a need for a recycled shoes program and to actually help provide shoes at a low rate for families that are under poverty.

The goal

Our goal is to design an app and responsive website providing a need for these families that are under poverty and providing them a pair of our own recycled pair of shoes at a low cost

The Role

UX designer leading the app and responsive website design from conception to delivery

The responsibilities

Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, iterating on designs and responsive design.

A Foot above
understanding the user

summary of user research

I used data collected from A Foot Above to develop interview questions, which were then used to conduct user interviews. Most interview participants reported feeling excited that there is a program that not only would allow you to buy recycled pairs of shoes and help save the environment. Participants were also excited to hear that these recycled shoes are affordable to even those who are living in poverty. The feedback received through the research made
it very clear that users would be open and willing to help save our planet by buying recycled pair and to contribute in helping poverty stricken families.

time

PROBLEM STATEMENT:
Jason Jones is a high school grad who needs a new pair of shoes for him and his family
Because the prices at shoes at retail stores are super expensive. 

user persona: jason

digital wireframes 

Our main goal is for the user to have a quick and efficient way to get to the registration page so that they can start the ordering process to order from the app.

Low Fidelity Prototype

To create a low-fidelity prototype, I connected all of the screens involved in the primary user flow of adding an item to the cart and checking out.
For the Low Fidelity Prototype we also incorporated the buttons and made the space and sizes of the images larger. All the pages have a shopping cart and a user profile as well as some icons describing how many shoes that have been recycled. We wanted the User Flow so that the user can go from the registration page, and into the ordering page and finally to the checkout in one smooth process. The links to the low fidelity prototypes are at the bottom.

I conducted a usability study with five participants using the low fidelity prototype for Knead Bakery. This study supported in how to progress with the high fidelity mockups and prototyping.

When creating the research plan, I established research goals as well as research questions that the study aimed to answer.

user Testing study findings

1.  The Majority of users found it was very simple to register their family from all devices
2. Users found it was not easy to return back to the home page. We added some buttons like the close button for them to go back to the home page.
3. Users were very pleased on how easy it was to select a shoe size that they wanted.
 

refining the designs

hi-fidelity prototypes

So in this prototype the main user flow goes from the home page, register users page, they pick out the shoe sizes, takes them back to the home page where they can order the shoes and select them and finally check out. It’s a simple one and done process.

A lot of my fonts are kind of big in my design which I used scalability showing what the most important pieces were and I provided negative space for easy readability

Another accessibility consideration that I used was the use of color. I made the colors blue and green so that the user can actually see the contrast and that it goes along with the websafe color guidelines

One accessibility consideration I put in my designs is in the mobile app I created text underneath many of the icons to show the user what that icon meant

accessibility considerations

going forward

impact

The impact of these designs. My users from the usability study actually loved quoting “How simple and easy it is to just find and select the shoes that I want and I enjoyed seeing the shoes from the home screen.

what I learned

I think what I learned from this journey is that there is a lot of similarity when creating for the mobile, desktop, tablet when it comes to your design and that the emphasis should always be how easy can my users find their products quickly and efficiently without jumping through many screens to get there.

app

We wanted to create the mobile app that is very user friendly. Allowing the user once registered to simply go start and selecting their preferred shoe size as well and selecting what type of shoes they want on the home page

Digital Wireframes Mobile

We wanted to create a tablet size that is very user friendly. Allowing the user once registered to simply go start and selecting their preferred shoe size as well and selecting what type of shoes they want on the home page. 

Digital Wireframes tablet

We wanted to create a desktop version that is very user friendly. Allowing the user once registered to simply go start and selecting their preferred shoe size as well and selecting what type of shoes they want on the home page.

Digital Wireframes desktop