Smoked Meeting Express

(A Case Study)

The Problem:

Smoked Meeting Express needs to find a way for customers to order their food and use their services because they don’t have a standard online ordering system in place.

My Role:

1 of 4 UX/UI Designers


Research:

Stakeholder Interview:

We conducted our stakeholder interview as a group with each having individual jobs during the actual interview. Mine in particular was to be the note taker due to the fact that the interview was conducted in spanish and my strength in being able to translate into english in writing in real time (yay billingual powers, thanks mom and dad).

Key Gains Learned From Stakeholder Interview:

  • The stakeholders really wanted to create a friendly atmosphere that is approachable to users that are from anywhere and everywhere

  • They wanted a way incentivize customers to visit them at the events they’re participating in, as well as order online for delivery.

Key Pains Learned from Stakeholder Interview:

  • Not having an actual physical location

  • Having to prepare the food as well as go deliver them

User Interviews:

After meeting with the stakeholders we then each individually did 2–3 user interviews on our stakeholders current website/way of ordering food from them. we of course had to do user interviews since of course everything is user driven mixed with a little of ‘make the stakeholder happy’ as well! We each interviewed 2–3 users giving us a total of 10 user to see what major take aways we could get.

Key Takeaways from User Interviews:

  • “I’ve never heard of ordering food from whatsapp”

  • “Smoked Meeting doesn’t have an address or website just a phone number. What are their hours and where do they deliver?”

Competitor Feature Analysis:

To see where our stakeholders fell in the market lineup we had to see what other competitors had that Smoked Meeting didn’t. We compared them to similar business doing the same thing such as Smokey Trails BBQ, Fatboyz Barbecue, Llanera, Meat Express Delivery, and JH Carne Llanera using a SWOT table. We noticed a lot of similarities but also noticed there’s a lot smoked meeting can offer that these competitors don’t.

Market Positioning Map:

We also decided to double down on this portion of the research and do a market positioning map. As you can see on the map most of the competitors catered to one particular side of the business be it having a lot of locations, wide choice of meats on their menu or being limited with locations. As you can also see on the map, Smoked Meeting Express current position was by far below the rest market wise due to one of their biggest pain points: Not having an actual location.


Analyzing the Data:

Affinity Diagram:

As I said earlier, this was a very realistic project not only because we were dealing with actual stakeholders that really wanted a fully designed website that would look inviting while staying true to their brand, but also because it was a group project meaning we had to work as a team and organize our thoughts as a team to come up with a single design the users, stakeholder, and us love and would agree on. This led us to organizing all our thoughts using an affinity diagram map. We each read each others interview notes and then started going sticky note crazy (virtually of course). We listed quotes in each sticky note from interviews that went under specific categories as you can see below. The quotes in the sticky notes are super small so if you ever really want to dive into them and read them please let me know and I’ll gladly shoot you over an original copy!

User Persona and Journey Map:

After analyzing our data collected from our user interviews we were able to produce a user persona which helped us determine what our website should do and how it should behave.

Using the user persona we also created a user Journey map which helped us organize our information to focus on areas we should work on that we may have otherwise overlooked and document a series of events and workflows.

Finding a Solution


Problem and Hypothesis Statements:

To define the problem and capture the most important finding from our research we came up with the problem statement of:

Smoked Meeting needs to find a way for customers to order their food and use their services because they don’t have a standard online ordering system in place.

We then came up with our hypothesis statement of:

We believe creating a user friendly website for Smoked meeting will achieve an increased amount of clients that will have no difficulty ordering their products. We will know we are right when we see an increase in orders online.

How Might We’s:

We each wrote down three respectiveHow Might We statements and then voted on all of our individual ones till we had three that we all agreed on. Then, after brainstorming and gathering all of our ideas that we came up with, we organized and prioritized all of them utilizing the Moscow Method. This method allowed us to determine what features were going to be implemented into the new overall feature as well as assisted in declaring what our Most Viable Product (MVP) was going to be.

Site Map and User Flow:

In order to get a better understanding of how the users would feel navigating the website, we decided to create a site map to see our overall content that would be on each page as well as a user flow.

Wire Frames:

Low Fidelity Wire Frames:

Now that we had all our UX and the WHY we are designing the way we were going to design we were able to move on to our low fidelity wireframes. We started off with some rough concept sketches of what we had ideated and followed those up with some testing.

Usability testing

Of course after any design choice the most important part is testing! We tested our low fidelity wire frames to see how users navigated through our design in order to achieve the same goal which led us to change some of the design.

Mid Fidelity

After the low fidelity wireframe was tested we made all necessary changes that our user testing made us aware of and came up with a little more detailed wire frame with more specifics.

Usability testing

We then went straight into testing our mid-fidelity wire frames as well! Like I said this is one of the most important things to do right along with the whole UX process! After our testing we made any necessary changes so that our high fidelity wire frame would come out as the quentissential design!


UI Part

Visual Competitive Analysis:

In order to get inspired going into our actual visual design we decided to do some visual competitive analysis by going to direct and indirect competitors sites and seeing what they had to offer visually.

Moodboard:

Now that we looked at what our competitors had to offer and got some inspiration we were able to begin our moodboard. We came up with certain brand attributes for the feel that we were going for visually and the below is what we came up with!

Style Tile:

Once we began designing our high fidelity screens we were able to create our style tile with elements we were using in our design.

High Fidelity:

After testing each design we arrived at our final high fidelity prototype. This was extremely satisfying seeing everything tie in together at the end with a design that met the goals of both the stakeholder and the users.