Berkley Center Web Design
Berkley Center Web Design
- In this project, I worked on revamping the Berkley Center website to improve its overall appearance and user experience. My focus was on reorganizing the page structure, simplifying design elements, and making sure the content was easy to read.
- Over the course of six months, these improvements resulted in a 7.8K increase in visitors and a 20k boost in page views.
My Role
UX Designer/ Developer
UX Designer/ Developer
Tool
HTML/ CSS/ WordPress
HTML/ CSS/ WordPress
Client
NYU Berkley Center
NYU Berkley Center
Directors
Paul Foster/ Shay Gaskins/ Steph Shyu/ Cynthia Franklin
Paul Foster/ Shay Gaskins/ Steph Shyu/ Cynthia Franklin
Result
Problem Statement
According to user feedback, the existing Berkley Center website faces challenges with an overwhelming amount of text and a lack of clear visual hierarchy, making it difficult for users to comprehend the content easily.
Additionally, some users have encountered formatting and scrolling issues while browsing the site on mobile devices, further affecting their experience and potentially decreasing overall user satisfaction.
Additionally, some users have encountered formatting and scrolling issues while browsing the site on mobile devices, further affecting their experience and potentially decreasing overall user satisfaction.
Goals
Improve Readability
Cohesive Design
Responsive Design
Design Approach ① - Improve Readibility
I made several design improvements to optimize visual clarity and overall aesthetics:
① Increased spacing between elements
② Soften sections divisions
② Soften sections divisions
③ Reduce Content
④ Consistent design elements
④ Consistent design elements
Design Approach ② - Reorganize content
Design Approach ② - Reorganize content
② -1 Organize information into different levels
To reduce the content, I separate content into different levels and create a clear hierarchy, then implement an intuitive navigation structure for easy access to information.
I also organized information into distinct categories based on their themes. After this I build distinct pages and components to create a clear hierarchy. This allows each page to maintain a clear focus, making it easier for users to find and understand relevant content.
Design Approach ③ - Responsive Design
Design Approach ③ - Responsive Design
- I started from the venture showcase pages which were designed for physical event, including the team directory and instructions for all the entreperneur teams. In this page, multiple participating teams could be featured, and people will read the the content on their mobile.
Results Highlight
Results Highlight
During a single day of the event, this page achieved remarkable user engagement, attracting over 500 users and more than 1000 pageviews.
Users praised the website's simplicity and intuitive design, enhancing their experience while accessing valuable insights about competitors' backgrounds, accomplishments, and other relevant details.
Reflection:
Reflecting on this project, it was a pleasure to revamp the Berkley Center website, focusing on improving its appearance and user experience. Over six months, these changes attracted 7.8K more visitors and increased page views by 20k!
While I'm pleased with the outcome, there's always room for growth. Moving forward, I'd like to apply these design elements to other pages, ensuring a cohesive and polished look throughout the entire site.