Deep Adalja

Team

Team

Team

Deep, Jenny, Melissa, Wanting Wang

Deep, Jenny, Melissa, Wanting Wang

Deep, Jenny, Melissa, Wanting Wang

Deep, Jenny, Melissa, Wanting Wang

Methods

Methods

Methods

Competitive Analysis, Heuristic Evaluation, Screeners, Interviews

Competitive Analysis, Heuristic Evaluation, Screeners, Interviews

Competitive Analysis, Heuristic Evaluation, Screeners, Interviews

Competitive Analysis, Heuristic Evaluation, Screeners, Interviews

Tools

Tools

Tools

Figma, FigJam, Google Forms

Figma, FigJam, Google Forms

Figma, FigJam, Google Forms

Figma, FigJam, Google Forms

Research, Design, Development

Research, Design, Development

Research, Design, Development

Research, Design, Development

Client

Client

Client

MyUT Team, Sejal Shah

MyUT Team, Sejal Shah

MyUT Team, Sejal Shah

MyUT Team, Sejal Shah

Duration

Duration

Duration

6 Months

6 Months

6 Months

6 Months

TexasERC Website

TexasERC Website

TexasERC Website

TexasERC Website

Overview

Initial Review

Survey

Insight Mapping

Expert Consultation

User Interviews

User Research Insights

Competetive Analysis

Major Design Update

Paper Wireframes

Lo-Fi

Design Decisions

Hi-Fi

Development

Overview

In this project, we focused on designing a more intuitive, accessible interface, moving through three core phases: Research, Design, and Development. This case study highlights the research and design journey, driven by user feedback and expert consultation.

Phase 1 ---------------- Phase 1 ----------------

Phase 1

Research

Research

Understand user pain points and gather actionable insights for designing an improved website experience.

Initial Review

As the first user, I performed a usability review to experience the website's flow and pinpoint potential issues firsthand.

Expressed a desire to use the search bar to find quizzes but couldn’t

Expressed a desire to use the search bar to find quizzes but couldn’t

Expressed a desire to use the search bar to find quizzes but couldn’t

Absence of a back button within the quiz interface was frustrating

Absence of a back button within the quiz interface was frustrating

Absence of a back button within the quiz interface was frustrating

Expressed a desire to use the search bar to find quizzes but couldn’t

Expressed a desire to use the search bar to find quizzes but couldn’t

Expressed a desire to use the search bar to find quizzes but couldn’t

Absence of a back button within the quiz interface was frustrating

Absence of a back button within the quiz interface was frustrating

Absence of a back button within the quiz interface was frustrating

Expressed a desire to use the search bar to find quizzes but couldn’t

Expressed a desire to use the search bar to find quizzes but couldn’t

Expressed a desire to use the search bar to find quizzes but couldn’t

Absence of a back button within the quiz interface was frustrating

Absence of a back button within the quiz interface was frustrating

Absence of a back button within the quiz interface was frustrating

Survey

I created and distributed a survey form to gather feedback from actual users

The survey focused on usability, accessibility, and overall user experience.

Objectives

Understand the current usability issues users are facing.

Understand the current usability issues users are facing.

Understand the current usability issues users are facing.

Identify features that work well and should be retained or improved.

Identify features that work well and should be retained or improved.

Identify features that work well and should be retained or improved.

Gather recommendations on design, functionality, and accessibility.

Gather recommendations on design, functionality, and accessibility.

Gather recommendations on design, functionality, and accessibility.

Learn about resources or competitors that users feel offer a better UX

Learn about resources or competitors that users feel offer a better UX

Learn about resources or competitors that users feel offer a better UX

Insights Mapping

I used a FigJam board to categorize survey results into four key areas: Positive Feedback, Negative Feedback, Recommendations, and Resources Mentioned.

Categorizing Meta Data

Expert Consultation

I consulted Dr. John Neuman, a well-known professor who teaches Accessible UX at UT Austin. He suggested conducting more user interviews to deepen the research.

User Interviews

Following the recommendation, I conducted additional user interviews, gathering more qualitative data.

I distilled these findings to refine the user personas and pain points.

Updated the Figjam Board following the interviews

User Research Insights

The Designs were usability-tested to ensure all elements aligned with user expectations.

There were 2 search buttons which was making the users confuse.

There were 2 search buttons which was making the users confuse.

There were 2 search buttons which was making the users confuse.

There were 2 search buttons which was making the users confuse.

There were 2 search buttons which was making the users confuse.

There were 2 search buttons which was making the users confuse.

There were 2 search buttons which was making the users confuse.

There were 2 search buttons which was making the users confuse.

There were 2 search buttons which was making the users confuse.

There were 2 search buttons which was making the users confuse.

There were 2 search buttons which was making the users confuse.

There were 2 search buttons which was making the users confuse.

There were 2 search buttons which was making the users confuse.

There were 2 search buttons which was making the users confuse.

There were 2 search buttons which was making the users confuse.

Competitive Analysis

Based on the resources mentioned by users, I conducted a competitive analysis to benchmark Texas ERC website against similar platforms, focusing on usability, design trends, and accessibility.

I did SWOT analysis of the competitors and figured out all the areas of improvement.

Phase 2 ---------------- Phase 2 ----------------

Phase 2

Design

Design

Translate research insights into practical design solutions through iterative prototyping.

Major Design Update

Transforming User Experience with a 3-Column Redesign

In response to user pain points, we transitioned from a traditional 2-column layout to a more dynamic 3-column design.

This change aims to enhance navigation, streamline content flow, and improve overall usability. By addressing core challenges, we’re creating a more intuitive and efficient experience for users.

Projected Benefits

Improved Content Distribution: Easier navigation with clearly defined sections for key information.

Enhanced Accessibility: More flexible layout adapts better to diverse screen sizes and user needs.

Reduced Cognitive Load: Users can find information faster without overwhelming the interface.

Increased Engagement: More visible content encourages longer interaction with the site.

Initial Paper Wireframes

I sketched out the initial wireframes based on the insights gained from user research.

Landing Page of Texas ERC

Landing Page of Texas ERC

Landing Page of Texas ERC

Low-Fidelity Designs

I then transitioned to low-fidelity (lo-fi) digital wireframes, focusing on the core layout and navigation structure without the distraction of detailed visuals.

Landing Page of Texas ERC

Landing Page of Texas ERC

Landing Page of Texas ERC

My Design Decisions

Optimized User Flow: Reduced Number of Clicks for Seamless Navigation

Before

In the original design, locating the staff directory required navigating through four steps. Users had to access multiple menus, which increased frustration and made the process unnecessarily complex.

Before

In the original design, locating the staff directory required navigating through four steps. Users had to access multiple menus, which increased frustration and made the process unnecessarily complex.

Before

In the original design, locating the staff directory required navigating through four steps. Users had to access multiple menus, which increased frustration and made the process unnecessarily complex.

After

With the redesign, I streamlined the navigation, reducing the steps from 4 to just 1. The staff directory is now more easily accessible through a prominent, intuitive shortcut on the homepage, cutting down on clicks and improving the overall user experience.

After

With the redesign, I streamlined the navigation, reducing the steps from 4 to just 1. The staff directory is now more easily accessible through a prominent, intuitive shortcut on the homepage, cutting down on clicks and improving the overall user experience.

After

With the redesign, I streamlined the navigation, reducing the steps from 4 to just 1. The staff directory is now more easily accessible through a prominent, intuitive shortcut on the homepage, cutting down on clicks and improving the overall user experience.

The Two Navbars

A

In this Design, the navbar was at the top of the hero section. But it had some issues with the readability. The text wrap was making it difficult to read. I tried this one just to see if it's usable and if it had, we don't invest our time in the 3 column layout, but it failed the expectations.

A

In this Design, the navbar was at the top of the hero section. But it had some issues with the readability. The text wrap was making it difficult to read. I tried this one just to see if it's usable and if it had, we don't invest our time in the 3 column layout, but it failed the expectations.

A

In this Design, the navbar was at the top of the hero section. But it had some issues with the readability. The text wrap was making it difficult to read. I tried this one just to see if it's usable and if it had, we don't invest our time in the 3 column layout, but it failed the expectations.

B

The new 3 column layout used the old navigation pannel which was already accesible.

B

The new 3 column layout used the old navigation pannel which was already accesible.

B

The new 3 column layout used the old navigation pannel which was already accesible.

The 3rd Column

Before

According the users feedback, the "Upcoming Events" tab is cruicial which was kept at the bottom.

Before

According the users feedback, the "Upcoming Events" tab is cruicial which was kept at the bottom.

Before

According the users feedback, the "Upcoming Events" tab is cruicial which was kept at the bottom.

After

Changed the priority of the "Upcoming Events" and optimized the 3rd column with it.

After

Changed the priority of the "Upcoming Events" and optimized the 3rd column with it.

After

Changed the priority of the "Upcoming Events" and optimized the 3rd column with it.

Prioritizing Tabs

Before

Earlier, the same links were put in the Navigation bar also but didn't help the user as I takes the same number of click to reach the required file. These were priority links for users.

Before

Earlier, the same links were put in the Navigation bar also but didn't help the user as I takes the same number of click to reach the required file. These were priority links for users.

Before

Earlier, the same links were put in the Navigation bar also but didn't help the user as I takes the same number of click to reach the required file. These were priority links for users.

After

As These links were vital for researchers, I put them on the "Home Page" so that users don't have to click multiple times to find the respective document.

After

As These links were vital for researchers, I put them on the "Home Page" so that users don't have to click multiple times to find the respective document.

After

As These links were vital for researchers, I put them on the "Home Page" so that users don't have to click multiple times to find the respective document.

Phase 3 ---------------- Phase 3 ----------------

Phase 3

Development

Development

Currently I'm working on the development of the website. I'm using WordPress & Pantheon for the same. Additionally I'm using CSS3 to give styling to the elements of the website.

DA

Deep Adalja

Product Designer

Download my Resume

adalja.deep@utexas.edu

Austin, TX

Home

Work

About

Blogs

Resources

Let’s Catch Up!

Handcrafted with

Like!

Like!

Like!

Copyrights | All Rights Reserved

DA

Deep Adalja

Product Designer

Download my Resume

adalja.deep@utexas.edu

Austin, TX

Home

Work

About

Blogs

Resources

Let’s Catch Up!

Handcrafted with

Like!

Like!

Like!

Copyrights | All Rights Reserved

DA

Deep Adalja

Product Designer

Download my Resume

adalja.deep@utexas.edu

Austin, TX

Home

Work

About

Blogs

Resources

Let’s Catch Up!

Handcrafted with

Like!

Like!

Like!

Copyrights | All Rights Reserved

Top