WebSmart
Re-Design

Re-design of the popular university website for students.

Our Goals

Easy

We wanted to redesign it to make it easier on the students to navigate the website.

Concise

The old design was very overwhelming on the student, while re-designing it we kept in mind the usability issues that out users were encountering

Helpful

The goal of the website is to make students excited about learning and going to school, so we wanted the website to be as helpful as possible to the user.

Fun

Learning and doing to school is supposed to be fun, so we wanted to understand the student and help them make the journey as easy and smooth as possible

Our User Personas

Ashley

24 years old

Don

34 years old

Alexa

22 years old

using the same grey background and profe

Susie

70 years old

Carlos

55 years old

with the same background and pose, put a

Gina

18 years old

Who was the website thought for?

When picturing the use for this transformative redesign of a critical website specifically tailored for community college students, representing a diverse spectrum of races, backgrounds and age. Recognizing the profound impact the app has on their educational journey, I prioritized user inclusivity to ensure that every student, regardless of background or age, could effortlessly navigate the platform for essential tasks. This encompassed seamless class selection, intuitive registration processes, and straightforward tuition payments. The redesigned app places the user at the center, embodying simplicity and clarity to guarantee that every student can easily comprehend and navigate the features crucial to their academic careers.

What are the issues found in the old design?

The previous design version of the design was very overwhelming, not mobile friendly, and falloff information that might be found very difficult from a user trying to achieve a simple and starightfoward task. The design was also outdates, and full of information that a student does not need in their homepage, for example the 'employee' tab, which only adds confusion in the overlay. Additionally, it was found to be extremely hard to navigate both for English speakers, and non-English speakers, which is the reason why the new design is open to everyone and easier to navigate.

Old vs. New Design

Approach and Sketches

Embarking on the redesign journey of WebSmart, we adopted a meticulous and user-centric approach to elevate the overall user experience. The journey commenced with thorough user research, delving into the diverse needs and preferences of the platform's users, focusing on the student's needs and concerns. This initial phase allowed me to identify pain points and gather invaluable insights, shaping the foundation for an empathetic redesign.

Transitioning from research, I translated my findings into detailed sketches, mapping out potential design solutions that prioritized simplicity, clarity, and user intuitiveness. Collaborative ideation sessions and feedback loops ensured a holistic approach, incorporating diverse perspectives in the iterative design process.

The refined sketches evolved into high-fidelity prototypes, capturing the envisioned user flow and interface dynamics. The emphasis was on fostering a seamless experience for users engaging in tasks such as class selection, registration, and tuition management. Visual aesthetics were crafted to align with a clean and modern design language, enhancing overall usability.

User testing played a pivotal role in validating design decisions and uncovering any remaining pain points. Engaging with a diverse group of users allowed for real-world insights, leading to adjustments that addressed specific user needs. Continuous refinement based on testing feedback solidified the success of the redesign, ensuring that WebSmart not only met but exceeded user expectations. The result is an intuitively redesigned platform that optimizes the user experience, making it a standout tool for students and administrators alike.

Results:

Home Page

The homepage was re-design to be direct, easy to understand and use, and accessible to people with disabilities as well; adding bigger buttons and icons to easily understand the tasks to be completed.

Landing Pages

The landing pages are now designed to be easy to understand to the user and not overwhelming, as it once was.

Mobile Version

To make it easier on the students and have the pages they need at anytime, we also decided to make a phone version of the website.

Conclusion & What Did I Learn?

In conclusion, the redesign of WebSmart marks a significant milestone in enhancing the user experience for our audience. Through meticulous research, thoughtful design decisions, and iterative testing, we have successfully created a platform that not only meets but exceeds user expectations.

The overwhelmingly positive feedback from users attests to the success of the redesign, with users consistently expressing their preference for the new interface. The improved usability, intuitive navigation, and visually appealing design have collectively contributed to a more engaging and efficient user experience.

Our commitment to user-centric design principles, coupled with an iterative and collaborative approach, has played a pivotal role in achieving these results. As we reflect on the journey of this project, it is evident that our focus on understanding user needs and incorporating their feedback has been instrumental in the success of the redesign.

Moving forward, we must continue to prioritize user experience, staying attuned to evolving preferences and technological advancements. The WebSmart redesign serves as a testament to our dedication to creating digital solutions that not only meet but exceed user expectations, setting a standard for excellence in user experience design.

What I learned:

Became even more familiarized with Figma
Learned how to conduct some User Experience Research
Learned how to put the needs to the users above everything else

WebSmart Re-Design