REDESIGN OF A PRESCHOOL WEBSITE
PROJECT BRIEF
This website was chosen for redesign due to a top-heavy structure with inappropriate categorization and labeling issues. Some links did not work, some were dead ends or incorrect.
Evaluated the Information Architecture of the website and developed a new design based on UX needs.
DESIGN METHODS
-
Persona
-
Competitive analysis
-
Content Inventory
-
Content Requirement
-
Sitemap
-
Low-Fidelity wireframes
-
High-Fidelity mockups
TOOLS
-
Adobe XD
-
Adobe Illustrator
-
Axure RP
-
Figma
COMPETITIVE ANALYSIS
Inferences made upon reviewing few well established preschools.
-
Easy access to contact information.
-
Enlarged high pixel images of kids in the school.
-
An organized, narrow and functional hierarchical structure.
-
Intuitive and provide quick access to information.
ACTIONS
-
Make contact information visible.
-
Use high resolution images.
-
Use a narrow drop- down menu.
PERSONA
Developed personas based on DEMOGRAPHIC DATA
ACTIONS
-
Include information on services and facilities.
-
Provide information on the educational programs offered.
-
Include staff information for parent-teacher communication.
-
Include image and video gallery of classrooms to show clean, healthy and fun environment.
CONTENT INVENTORY OF CURRENT WEBSITE
CONTENT REQUIREMENT
Performed content requirement analysis for the preschool website.
HERE'S HOW THE WEBSITE GOT REDESIGNED
CURRENT
CURRENT
CURRENT
CURRENT
PROPOSED
PROPOSED
PROPOSED
PROPOSED
CURRENT
PROPOSED
-
Global navigation bar with shallow and broad structure
-
Two level structure, very challenging for future for future expansion.
STRUCTURE
-
Well organized hierarchical structure for easy navigation
-
Reduced links on the main navigation bar with drop down menu for future expansion.
SITEMAPS
-
The subordinate links under "Curriculum" do not fall under the category.
-
Information on birthday celebrations and future events is included under a label “Miscellaneous information” which is misleading to users.
-
No specific order and prioritization of global nodes.
-
Global nodes like "Hours", "Fees" and "Illness" are very specific.
CATEGORIES
&
LABELING
-
Including more generic global nodes would lead to better prioritization of tasks.
-
Consistent labeling throughout the website.
-
Labels indicating the aboutness of the content.
-
Non intuitive navigation with links leading to wrong pages.
-
The global navigation bar is not accessible from all pages and navigation between pages is not possible.
-
Problem in accessing information on working hours. Clicking on the “hours” link, the page is directed to testimonials and not working hours.
GLOBAL LINKS
NAVIGATION
&
ACCESS
-
Organization logo accessible to all pages.
-
A search option.
-
Inclusion of breadcrumbs.
-
A vertical navigation bar only intended for homepage would be useful to direct users to lower priority links with no sub nodes.
-
Address footer containing contact information.
KEY WIREFRAMES
EXAMPLE HIGH FIDELITY MOCKUPS
Homepage
Curriculum
About Us
Admissions
