LuyHold Mobile App

The client's concept started out really vague, so it was hard to start imagining how this app would work and what it would look like. The idea needed to be focused and refined for us to begin designing the product.

We met with the client to understand the product and ask some refining questions. Some of the questions were:

• What is the specific problem we are trying to solve that has led to this concept?

• Can you describe two to three potential use cases? 

• What features/components need to be included in the MVP?

• What design or development parameters do we need to consider?

Getting these questions answered helped us to define the scope of the project, set expectations, and determine the deliverables.

I mapped out the users’ steps to see how I could simplify their journey to help them reach their most important goals with the product. This was also a great activity to help us see if we were understanding the client correctly. After a couple of revisions, we landed on three main flows that we would design for.

Sketches

I started sketching out some ideas to get an idea of the form and function and layout some initial concepts quickly.

LoFi Wireframes

One of my teammates took the sketches I made and began developing them into lofi wireframes. I then expanded on these adding a few more screens to ensure we were presenting a complete experience.

Logo, Style

Our client's main inspiration came from the Airbnb and Apple Wallet applications. A member of the team made sure to keep simplicity in mind when designing the logo for luyhold and defining the colors and styles for the app

Initial HiFi Wireframes

With the lofi frames and style guide approved. We began applying the styles to get our initial high-fidelity wireframes. This was just the start. It took several iterations with the client to get to what he was envisioning.

Rapid Prototyping

Our initial screens were a great start, but there were still some very important UX and UI questions we needed to answer. We spent some time iterating within the team as well as with the client to get us to our final wireframes.

Homepage refinements

The initial design of the homepage featured a favorites section as well as a categorized section. The client preferred to do away with the favorites and just make all cards accessible by scrolling through. We wanted to keep the categories, so we pushed it down to the bottom and made it accessible by pulling the tab up.

We also gave the details of the individual cards that inform the user of what they are. We weren't able to design for all possibilities, so I created card forms for ID cards, coupons/loyalty cards, and documents, then created one more for all other uses.

Modifying the Card Scan & Access Flow

The client wanted to minimize the card scan experience as much as possible. We wanted to ensure that getting to the scan portion of the card was quickest experience, but still allow for the card details such as, expiration, activity, and more was easy to discover and access. After a few iterations, we got to a solution we could all agree on.

Dark Mode

One last thing the client wanted to explore was dark mode. We were able to invert the colors and create a dark experience giving the users the option to toggle between light and dark.