Miquelle Leonard
UX designer

Jax Burgers Case Study

Creating a new online presence for this local business.

Image alt tag

JAX Burgers is a project redesign of the current website and web experience. Designing to improve the online experience for the Jax Burgers customer. Customers can be deterred from a website that is not only visually pleasing but a website that won’t be deemed useful. The goal was to create a website that was better user flows, visually esthetic, and mobile-friendly. 

Interviews

Insights that were gathered from the users were that localized content was important to them. Not just words saying that the AHA ‘did this’ or ‘that’ but actualy proof, such as media clippings, social media posts, images, word of mouth.

 

Stakeholders wanted a website that served as one landing page for multiple markets in our region. The landing page would feature local stats and ‘what we did’ to serve our community.

Jax Burgers Website Redesign

Personas

Personas are built based on the community members who ask our development staff how their funds or support is impacting the local community. Research is one thing, but many of our users want to see results and how those results impacted those around them. Important information about each of our personas are the value they hold to our organization. Each of the persona mockups are based on people who are our stakeholders in important meetings and those who drive our mission.

Jax Burgers Website Redesign

Sketches

Example

I usually start the design process with low fidelity wireframes. This is the way I iterate through many design options quickly.

Guiding Questions:

  • What was the main purpose of your sketches? (presenting, testing, brainstorming?)
  • How did your knowledge about your users and their goals influenced your sketches?
  • How many different versions you made?
  • What were the main differences among these versions?
  • Which version did you choose and why?
  • Explain the layout and the arrangement of the elements!
  • Why did you put the elements to a certain place?
  • How did your sketches helped you more forward?
Jax Burgers Website Redesign

Wireframes

Example

At the beginning of my design process I created wireframes for testing purposes.

Guiding Questions

  • Why was it useful to do this?
  • What kind of wireframes did you make?
  • Low fidelity or high fidelity?
  • What tool did you use for this?
  • Did you use them for testing?
  • How many iterations did you have?
Jax Burgers Website Redesign

UI Design

Based on research and user testing, a landing page for this content was the design solution. The page includes news clippings, videos, press releases, and audio clippings. Anchors at the top of the page lead users directly to local content. Two column content, one side with statistics video and the other side contained text along with link to any press clips or releases. Each community video will be catty-corner to the one above and below it, letting the page flow from top to bottom. The design decisions were made to help users with multiple goals easily access the information they are seeking.


A challenging steps during this process was evaluating the amount of text our stakeholders wanted on the website versus the content that users were actually looking for. Users wanted direct content, such as: key facts, videos, infographics.

 

In conclusion, the work is never done. There are constant interations.

 

Continue to research to see if the company is interested in this type of transition. This would also entail having to create a product in-house that can manage online orders automatically and reduce the wait time for their customers. User testing would have to be ongoing to confirm that the new product meets the expectations and proven results. 

 

The next step of creating an inhouse online ordering system would be in works and would help staff navigate a better digital experience and function front house as well as back of the house. The ordering system would function on a tablet, such as an iPad.