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
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.