UI/UX DESIGN • CLASS PROJECT
Date
2020
My Role
Solo Project
TOOLS
Figma
The Greek Roman Art and History Museum website landing page is designed so that users are drawn to visit because of the sneak peek given by the elegant website design.
The Greek Roman Art and History Museum is a museum for history and art enthusiasts, aiming to connect Ancient Greek and Roman history with art on a deeper level. The museum focuses on relating Greek and Roman history and mythology to art that varies from that time period and other eras, such as the Renaissance era.
Visitors who visit the museum want to know more about the museum ahead of time. They would also like to know ahead of time if they can purchase tickets, and if there is any other important information they need to know before visiting the museum.
I compared various museum websites to see what they had in common and what each website emphasized. After analyzing these, I gathered the commonalities to see what I should prioritize for the users in the website to design. After this process, I knew I wanted to include certain elements, such as a tickets button, COVID-19 information, a big hero image on the above the fold, and an exhibitions section.
The main audience for the website is adults who are interested in the museum, history, or art. The website is to connect potential visitors to more information about the museum so they have the resources to actually visit. The website also provides ways for visitors to support the museum in other ways. The visitors are a majority of the people who visit the museum. These people are likely not used to the museum’s website, and will only look on the website a few times. Their main goal is to find the basic information about the museum that they need to visit, such as hours, where to buy tickets, and location. To design for the visitors, I made this this basic information easily and clearly accessible, and located high up in the landing page. The members and supporters are the people that want to support the museum in other ways aside from buying tickets. The website should be clear on what the money is going to, and the personal benefits of supporting through membership. Hence the design is persuasive and encourage users to support in other ways, and I included a call to action that is centered around donating.
I made three different sketches of the desktop version to ideate different layouts. In the end, I used a combination of a few of the different sketches because I liked certain components and elements of each one. The main call to action is the tickets button, to show users where to buy tickets, so that was slightly emphasized in the sketches.
The website prototypes went through three major iterations throughout the whole process. From the first to the second draft, the main change based off of feedback was better emphasizing the historical aspect of the museum in the content and design. Because of this, an “About” section as well as a better connection with history in the content of the exhibit and events. A social media section was also added to better connect the user to the museum and potentially help convince them to visit the museum. From the second draft to the final prototype, there were a variety of changes. The historical aspect of the museum was emphasized slightly more again. The colors were also altered to a darker shade to make the white text against it more legible. A section focused on visiting the museum was also added, in order to better emphasize the visiting related call to actions. In the final prototype, a few hover states were also added, mainly differentiated with an underline or a darker shade for buttons. For images, the hover state was only slightly different, with drop shadows.
The content of the website is divided in multiple sections including an announcements hero image carousel, an about section, a visit section, an exhibitions section a newsletter section, an events section, a social media section, and a contact us section. The about section was placed high up to the top to better clarify to the users what the museum is about and the contents within the museum. The visit section was also strategically placed high upon to emphasize the call to action to visit the museum by providing the basic and important information that users may need to visit the museum. The collections and exhibitions section as well as the events section mainly help garner the interest of users and increase the desire for users to visit the museum. The newsletter section and social media section aim to connect the users with the museum in a deeper and closer level, to also strike interest in users to increase likelihood of them visiting the museum.
Design Decisions
The main factor considered during the design process was the presentation and hierarchy of information, as well as overall visual appeal.
The presentation and hierarchy of information was one of the top priorities when designing this website. This is demonstrated by the order of sections and information as well as the order type hierarchy in the about section.
The overall visual appeal was also very important when designing the website. The imagery, typefaces, and color palate were carefully chosen to best represent the museum to create a classy and educated tone, while also simple and straightforward and hopefully increase interest in the users.
From this project, I learned multiple different skills. I learned about the importance of iterations and ideation, especially early on in the process. Creating many ideas in sketches in particular can change things dramatically. Although I thought I had a good idea of what I wanted my project to look like, after making many sketches, I discovered layouts of sections that I ended up liking better than my original ideas, even though those were thought of on the fly. I also learned a lot about the importance of feedback from others throughout the entire process from beginning to end. Often times, another pair of eyes on the project can catch things that the, have a first impression, and look at it from a broader point of view, which is hard for the designer who has been working on the project for so long probably has a harder time doing. In general, I also learned a lot about website design. Something I would change if I were to do it again would be better brainstorming and researching ways to emphasize the historical content of the museum more, because although I tried to clarify it a lot, it still may not be entirely clear. For future projects, I plan on applying what I learned about iterations and feedback.
Let's connect! Feel free to reach out to me for opportunities, comments, or just to chat!