Instructions to complete the paper;
The paper will be a descriptive paper (8 to 12 pages of content) that describes the design aspects
of the two chosen existing restaurant website interfaces. The paper will include aspects of
functionality and user requirements. (Screenshots, sketches, diagrams, personas, wireframes, and
sitemaps included in the paper proper will make the paper longer
Part of learning about the UX design process, involves learning about personas, wireframes, and
sitemaps and how they are used as tools to empathize, define, ideate, design, and test (design
thinking stages) the organization of a website and the navigational options (information
architecture) of the website interface layout. This is the stuff of design thinking applied to web
design. See recommended article readings which provide foundation and background about the
essences of wireframes, models, and examples.
Paper Structure
Table of Contents
Introduction
Personas
Wireframes and Sitemaps
Site Comparison
Suggestionsfor Improvement
Conclusions
References
Overall Directions: Choose two different existing restaurant websites. They can be a local
restaurant or a national chain. Compare the two, drawing from concepts of UX design,
information architecture, and the user experience journey. For demonstration purposes to go with
the narrative of your comparison, you will present and describe personas, sitemaps, and
wireframes for each website. You will follow components of wireframes (layout, hierarchy, etc.),
and compare and describe similarities and differences of the two websites. You will describe
issues related to navigation, aesthetics, complexity, and finding things, etc. You will suggest
improvements to the website designs, including a new wireframe design – one for each or one
combined. Throughout the paper, you will integrate literature review to substantiate your
narrative.
Title page: Your full name, course #, title of your paper modified accordingly– “UX Design
Comparison of ABC (real name here) and XYZ (real name here) Restaurant Websites”
Table of Contents (TOC): Sections should follow the structure for the paper.
Introduction: Introduce the two restaurant websites(chose any 2 from Mc
Donalds/Wendy’s/Taco Bell/Burger King, you will need to visit their websites navigate them to
help in completing the paper) with narrative about them, why you chose them, and a few
2
UX design Paper due on 28
th March
screenshots (landing page, other important pages) of each of the websites to demonstrate their
design strategy. Explain why they need to be evaluated and compared.
Describe UX pain points with the websites. Describe issues related to information architecture.
The focus should also weave in common ground with our understanding of the user experience —
what the user enjoys, finds frustrating, what the user is looking for, what is visually appealing to
the user– the everyday feelings and experiences we all have when we visit a website that needs
some improvement!
Personas: Create a user persona that represents the “typical” user types being drawn to these
websites. Describe a user persona that represents the characteristics/needs of users (user types)
visiting these websites. Create at least one persona for each restaurant website. 2 Personas for the
2 websites
Wireframes and Sitemaps Demonstration (for each website): Create wireframes and sitemaps
for each website, focusing on the landing page and perhaps the menu page, something that needs
work. Describe how the sites are similar and how they are different. In what way do you think
they were designed for certain types of users? Follow the components of wireframes: layout,
hierarchy, interaction, content, and functionality. Follow the characteristics of sitemaps: concise
labels, website structure, home or starting point, relevant screens or pages.
In comparing the two restaurant websites, include visuals such as wireframes and sitemaps.
Create a wireframe for each restaurant website, at least the main page and two or three other
pages. Wireframes can be drawn or sketched by hand, or you can use a wireframe software tool
(like the free trial Figma, Balsamiq or Axure RP, or InVision app). Whichever method you
choose to use, you need to scan the diagram into the paper. Note that if you are using a tool like
Figma or a different one, you need to save the images as .gif or .jpg to insert them into the
paper.) Also, create a sitemap (either hand-drawn (paper) or use a tool) to show the navigation
scheme of each website, even if the website does not have a sitemap. (A sitemap is an outline of
a website’s navigation scheme or information architecture (IA) of each website.)
Note: If you are interested in using a digital tool. I personally like using Figma as it is open
source and easy to learn how to use. (There are also plenty of YouTube videos on how to use
Figma. Stick to the basics.) You can create digital wireframes and low fidelity designs easily
with this tool. I also like to do my own sketching with good old pencil and paper, so screens,
wireframes, and sitemaps do not have to be fancy, but they must be legible in the paper!
Site Comparison (Depth) Discussion: Discuss issues in depth related to navigation, aesthetics,
complexity, finding things, etc. Which site is easier to navigate and to find things, and why?
Suggestions for Improvement: What are some suggestions for improvements? On what basis
would those improvements change the look and feel of the interface, and perhaps, navigation?
Create a sketch or use a tool to produce a wireframe and sitemap of a new and improved design,
based on those recommendations for improvements. If desired and appropriate, combine the
designs of both restaurant websites into one effective website design.
Conclusions: Provide a summary of what you learned and the importance of UX in website
design.