Responsive Website Redesign

Client:

NIAS

Role:

UX Researcher, Visual Designer

Timeline:

8 weeks

NIAS is an educational institute in India who approached us to revamp their existing website into a more intuitive, responsive and user-friendly experience.

DISCOVER

Uncovering what wasn't working

Heuristic Evaluation

Heuristic Evaluation

Competitive Analysis

Competitive Analysis

Heuristic Evaluation

To begin, we conducted a Heuristic Evaluation of the current website to identify areas that needed the most attention

Cognitive Overload

Heuristics Violated:
Aesthetic and Minimalist Design, Recognition Rather than Recall, Consistency and Standards

Confusing Main Navigation

Heuristics Violated:
Match between System and Real World, Visibility of System Status

Missing Links

Heuristics Violated:
Visibility of system status

Competitive Analysis

A Competitive Analysis was conducted to identify market gaps and understand user expectations

DEFINE

Giving structure to our research

Information Architecture

Open Card Sorting was used to re-define the navigational structure of the website

DESIGN

Designing the outline of the new website

Low-Fidelity Wireframes

With the app’s structure in place, the next step was to translate these concepts into tangible wireframes. Here’s a first look at how the new website begins to take shape.

Mobile-First Approach

We started with the mobile design first as it helped us structure information clearly within limited real estate.

Intuitive Navigation

Our main aim was to help the user easily access information, so we added an easy navigation menu.

Clean UI

The previous website was cluttered and information was hard to access, so for the new website, we kept the UI clean.

DELIVER

A fresh look for the website

High-Fidelity Prototype

With the app’s structure in place, the next step was to translate these concepts into tangible wireframes. Here’s a first look at how the new website begins to take shape.

Bold Colors

We presented a number of color palettes to the clients and chose one that best represented NIAS.

Simple Fonts

We kept a consistent font across all screens and delivered a design system to the developers.

Interactive Elements

We added interactive elements across images and navigation elements to increase user interaction.

Vertical Navigation

We added a vertical navigation to help the user access all elements easily.

Breadcrumbs

Breadcrumbs were used to inform the user where they were in the website at any given point

Bold Titles

We added bold titles in order to avoid confusion and ease navigation.

CONCLUSION

Key Takeaways

What I learnt from this project

Redesigning NIAS’s website taught me core UX skills: heuristic evaluation to spot flaws, competitive analysis for benchmarks, and mobile-first design to prioritize content. Constraints like limited screen space pushed me to simplify navigation, proving how limitations can spark creative solutions.

How I got creative when I couldn’t talk to users

Without direct access to our users, we relied on competitive insights and stakeholder survey data to learn about user needs. Balancing NIAS’s vision with user-centric design taught me to advocate for users indirectly, turning challenges into opportunities for resourceful problem-solving.