Royal
Royal
Role
UX Design
UX Research
UI Design
Contributions
User Interviews
User Journey Map
Wire-Framing
High Fidelity Prototyping
Tools
Figma
SurveyPlanet
Nebo
Tasks
User Journey Map
User Research
Usability Test
Wireframe
Prototyping
Site Map
Duration
November 2024-Janurary 2025
Overview
This museum website is to show numerous events that allows the user to select numerous individuals to go with on a visit to the museum.
Issue
The user is having trouble getting a decent event with the ease of purchasing tickets for their group.
Research
The research done for this project involved getting an audience that dignifies the average person looking for events to go to. The main concern is catered towards someone wanting to bring a group of individuals. Whether it's for a school, party, birthday or celebration. Age ranges from 23 to 55 with a majority that will come from people in the 30s age range. Having this age range has made me consider making a responsive website that has ease of use and clear imagery.
Pain Points
User Journey
Meet Evan
User Journey Map
Sitemap
Early Design Ideation
Paper Wireframe Sketches
A core principle of this website's design is the strategic use of prominent visuals to quickly convey the museum's value proposition and the nature of its exhibits and events to potential visitors. This is displayed throughout the different sketches that was made.
Low-Fidelity Wireframes
In the initial low-fidelity wireframing stage for the Royal Museum website, I developed similar layouts for desktop, tablet, and mobile. My primary focus was on establishing the desktop content hierarchy, prioritizing the integration of large, high-quality imagery that could be responsively scaled down for smaller screen sizes while preserving visual fidelity across all platforms.
User testing Low Fidelity wireframes
This bar graph below demonstrates each participants understanding and success from prompts 1-3 from an unmoderated usability test. Participants were generally successfulessful in completing each prompt except for one individual in Prompt 3.
High Fidelity
Sticker Sheet
For this project I observed many different typography that would best fit this project. I decided to go with Timelight for the title of the website. It makes the world 'Royal' standout. The varying sizes and weights establish a clear visual hierarchy, guiding the user's eye through the content. The choice of fonts (TimeLight, Jadson Bold 21px, Jadson 17px, Jadson 15px, Jadson 13px) and their corresponding sizes will directly impact readability across different screen sizes and content sections. I used a distinct color for the active state (implied by the purple 'Royal' and the selected 'Visit Us') is crucial for way-finding. Overall, the carefully chosen color palette and subtle elevation create a recognizable brand identity and visual depth, all contributing to a user-friendly and aesthetically consistent product.
High Fidelity Usability Test Results
Audience
This usability test audience consisited of 6 people from the age range of 26 - 62. From this age range there were people that had a liking to art which made this website relatable. There were also people who did not care much about art but struggled to go somewhere and have gruop order done easy and with a benefit.
Methodology
The method for this project was a unmoderated uasability test. This allowed the user to be comfortable and honest in their deliberation. This has also given me viable results that were done on different devices.
Results
This bar graph below represents the success rate in which each of the 6 participants where able to read and understand the prompts, enter the prototype on their chosen device without issue, flow through the prototype and discuss what issues they had or give feedback.
Takeaway
Challenges
What has chaellenged me from this project was the implementation of a carousel on 3 different platforms. I made a baseline guide for the type of carousel I wanted and had to rearrange a significant amount to get them to fit properly for each device.
Learned
One of the things I have learned from this project is unity across platforms, I made sure to use the same brand colors throughout the entire website, no matter if you're looking at it on a big computer screen, a tablet, or your phone. From research I learned why the color purple relates to royalty in such a historic fashion.
In addition, I made things interactive, I added a neat little slide-in animation to mobile. Aswell as managing space on the website so it does not feel cluttered or too much white space.
Overall, I feel a lot more knowledgeable with incorporating animation transitions styles, carousels and a color palette that is adequate for the user on a website. Furthermore, I found that my usability test are well done, but can be longer and more engaging to better grasp a understanding on more details of the website.