Yale School of Art Redesign
Design Process & Analysis
_edited.jpg)
Home page for the SoA website
Design Problem
The Yale School of Art (SoA) website would benefit from improvements in its organization and hierarchy, as the current layout appears cluttered and lacks a clear structure. Enhancing the website's navigation will optimize user experience, allowing visitors to access information efficiently without undue effort, searching through numerous tabs, pull-down menus, and scattered links.
Objective
When redesigning the Yale School of Art's website, significant emphasis was placed on optimizing the design and information layout. A primary issue with the existing website revolved around its lack of organization, hierarchy, and overwhelming visual elements, which impacted user experience negatively. In order to address these challenges effectively, the redesign initiative focused on implementing a refined hierarchy and a more subdued color scheme inspired by the schools existing color pallet. These improvements aimed to enhance user-friendliness and facilitate information retrieval for a seamless browsing experience.
Potential Users Breakdown
Before proceeding any further it was important for me to understand the current demographic and potential users coming to the website. Below are a couple of key findings:
Target Users
-
Newly graduates
-
Returning Students
-
Current Yale SoA Students
Needs
-
Apply easily without too many clicks or steps
-
Find portfolio requirements and application deadline details
-
Have easy access to upcoming events on campus
-
See the most recent school of art news
Assumptions
-
Some knowledge of the Yale SoA
-
Basic computer skills (enough to navigate a website)
Motivations
-
Job is paying for their graduate school
-
Better paying job
-
Looks good on resume
-
Class requires event attendance
-
Wants to be featured on schools website
Wireframing
By identifying the existing and potential user base, along with an analysis of their browsing behaviors on the website, it helped in initiating the wireframing process with a strong focus on meeting their specific needs. This approach ensured the foundation for a well-informed and impactful redesign
Sitemap
The home page will be the main hub of the website that allows you to access every aspect of the website easily without having to make too many unnecessary clicks. Even after clicking on another tab such as the “events page”, you will still have full access to everything else through a header at the top of the page with buttons leading to other areas of the website. So even if you are on the “apply page” looking at the portfolio requirements for graphic design you can still quickly jump to the gallery by clicking the “gallery” button in the header at the top of the page.
_edited.jpg)
User Tasks
Below are a several user tasks to be used when testing and assessing the prototype
01
An incoming graduate student is looking to put together their resume and portfolio as a graphic designer but is wondering what the specific requirements are for GD. Where would this information be found on the School of Art website?
02
A current student was given the opportunity to earn extra credit by attending an upcoming school art exhibit, the teacher only mentioned it was called “event 3” and didn’t mention any of the details. If you want to find out the specifics of the event, how would you navigate the website in order to find out when and where “event 3” is taking place?
03
An incoming student is hoping to apply to the school of art, this is their first time ever applying for the school, and has no previous credentials for the website. Where might they go in order to sign up for a yale school of art account?
04
A current student at the school of art is wondering what is going on around campus recently and was hoping to catch up on the news by reading some articles. How might this student navigate the website in order to learn more about the current state of the school?
Reflection
Looking back at the redesign of the Yale School of Art website, a significant focus was placed on revamping the hierarchy for improved user experience. The navigation underwent a fundamental shift, transitioning from a left-sided layout to a more user-friendly header at the top of the screen. Additionally, efforts were made to enhance the signal-to-noise ratio by presenting only essential information in a well-organized manner, using boxes and proximity to convey content distinctions effectively.
The pursuit of better legibility led to a cleaner, modern aesthetic, characterized by a minimal color palette and consistent font throughout the website. While the visual appeal of the original design was sacrificed, the emphasis on clarity and usability took precedence.
Moving forward, my focus will be on refining the events and gallery pages, adhering to the design principles already implemented across other sections of the website.
To the right is the original document containing my findings and a deeper dive into the design principles the old website was lacking and highlighting the ones present in the redesign.