Shri Ram School
E-magazine for The Shri Ram School
.png)
Timeline
2 Months
What we did
Research, UX Wireframes, UI Design
Tools
Figma, Adobe Illustrator, Adobe Photoshop, Google meet, Zoom Meeting
Project Overview
The Shri Ram Schools were born out of the ideology that children must be given an environment that makes them want to come to school every day. We have to create the school yearbook. This site should be different from all the competing sites and should be more modern and attractive for the children. It was also necessary to showcase work for each and every student, and the activity corner should be relevant for all the classes.
Needs
We began by reviewing the current website and getting information from the client about their requirements. We looked at the information they want to display on their website and the functionality they require in various places.
The main goal for this project were:
-
The website's user interface (UI) should be up to date and simple to use for children in PV through 5th grade.
-
Improve information architecture, to make it easier for children to obtain.
-
Showcasing each student's work as well as creating a flipbook to display all the ongoing activities throughout the year.
Problem Statement
The way of presenting the content on the previous website was complicated, not intuitive, and unattractive. It caused students and parents to be unable to find the information they were looking for.
Our Role
The primary goal of the team was to design and prepare for the development of a new website optimized for desktop only. We achieved that by collecting information from the Shri Ram school teachers during the workshop, defining the current needs and expectations, and revising assumptions during the research and discovery.
We were working on:
-
UX Issue
-
The UI Visual Style of the website
-
Preparing its components for the development team,
We recommended and provided solutions for the best user experience, sustainability, accessibility, and the most efficient website performance.
Our Workflow

Teacher's Insights
Speaking from the perspective of the teacher, that why a digital yearbook is more beneficial than a physical one and why students will find this to be more engaging.




*images are just the placeholder.
Student's Insights
Speaking from the perspective of the student, that why a digital yearbook is more beneficial than a physical one and why students will find this to be more engaging.




*images are just the placeholder.
Userflow

Wireframes

Typography


Colors and Iconography


Buttons and Navigation State




Illustration Style





UI design

UI Screen
UI Design is the process of creating the visual elements of a website. Our task is to create a design direction, which demonstartes the basic principles of user interaction.
m.png)

Design Elements

Our Learnings
-
We discovered that the most crucial part of the UX process is centred on posing the proper queries to the relevant users because they have a significant influence.
-
We also discovered that receiving input is the most crucial step in the design process because it enables you to make improvements to the design across the board.
-
Additionally, the project taught us how to communicate effectively with every member of the team.
Outcomes and results
-
Users will spend less time searching the website for what they need thanks to the straightforward and minimalist design
-
Additionally, we are presenting the culture of student life. All of the pupils' work, including drawings, stories, poems, music, and videos, is being displayed.