Send the link below via email or IMCopy
Present to your audienceStart remote presentation
- Invited audience members will follow you as you navigate and present
- People invited to a presentation do not need a Prezi account
- This link expires 10 minutes after you close the presentation
- A maximum of 30 users can follow your presentation
- Learn more about this feature in our knowledge base article
Do you really want to delete this prezi?
Neither you, nor the coeditors you shared it with will be able to recover it again.
Make your likes visible on Facebook?
You can change this under Settings & Account at any time.
A Commemoretive Website for National Institute of Design
Transcript of A Commemoretive Website for National Institute of Design
National Institute of Design
To mark the 50th anniversary of the foundation of National Institute of Design (NID), a commemorative website was proposed to be built for the Institute.
Design a Commemorative Website where NID's glory and achievements could be showcased and the information related to the upcoming events could be found.
It was my first project for web and I had no domain knowledge.
Pictures clicked, collected photos from the Institute repository and archives
Before starting the research, the context was needed to be understood well so that the data-gathering should find some direction and relevance.
Brainstorming Sessions followed by Mind-mapping
Building up personas
Then tasks and sub-tasks were defined as per the user goals.
Once the tasks are known, then to facilitate those tasks, appropriate content is planned to be put up with relevant features.
By knowing the frequency of the tasks being performed by the probable users AND keeping the business goals in mind, the content was prioritized.
To design the website interaction.
Building The Information Architecture
Age: 24 years
Nalin is a post graduate graphic design
student studying in NID, currently in 4th
semester. He belongs to mechanical background
and is very interested in getting diverse
aspects on design. He has been attending
workshops and conferences in many
places in India.
Persona: Kalpana Ramachandran
Age: 19 years
Kalpana has given her intermediate (10+2) and interested in design. She has known quite a couple of design schools around but through her friends she is more interested in this institute. She wanted to know more about NID's design endeavors, a kind of portfolio wherein she can go through the initiatives and design interventions that were happened in the past. But unfortunately, the current website of the institute does not serve these information.
Persona: Anirudh Gupta
Age: 29 years
Anirudh is an Alumnus of NID who spent 5 years in the institute in pursuing his graduation in Film and Animation. He passed out in the year 2009 and currently he is a Senior Design Consultant at ABC, a renowned design agency in Mumbai. He is still in contacts with the institute professors and his juniors who are currently studying there. He regularly shares his design thoughts with all of them.
Persona: Amit Kulkarni
Age: 47 years
Amit Kulkarni is a senior professor in Textile Design Department. He is been contributing to this institute since 1980 and have guided many batches under his supervision. He often recalls the memories of the institution, the achievements and the great moments and narrates to the students so that they can get inspirations out of it.
Persona: Akhil Prasad
Age: 54 years
Akhil Prasad is a Print Lab assistant of NID and has been serving for the printing department since 32 years now. He has witnessed the change in print technology and is concerned about the future when the print will totally get replaced by digital media. He want to spread the awareness on the printing techniques among the upcoming generation.
Persona: Lisa Sinclair
Age: 21 years
Lisa Sinclair is a British student-intern who has come to India to learn graphic design in NID as a part of her internship at XYZ College of Arts, London. Ever since her joining, she is mesmerized by the cultural perspective of design. She is very curious and attentive to details. She always wanted to know more about the institute and the work that has happened before.
How NID is different from other design institutes?
"NID teaches designing an approach, does not
go based on material and technique."
"Larger environment of design sensitization"
"Design projects provides the context for learning."
"Broader education/ Opportunities for students
to learn design from inter-disciplinary courses"
How many people outside know about NID?
"Very less people used to know about design
earlier but now people are more aware today."
"According to demographics, as compared to other institutes likes IITs, medicals, IIMs and others, people knowing about NID is very less."
"NID is known more in design circles, industry and other industries. However, awareness of common person is yet to be penetrated."
"NID graduates, alumni who are well-established
in the market today."
"People not only from design institutes but
also home sciences do know about NID."
Why this celebration is so special to you?
"On the ladder of success, we often forget to thank them, because of whom the height is reached. So, this an opportunity."
"The time to show the heritage we have acquired till now."
"It is a pride being a part of 50th year of design education in India. NID is the first design institute in India."
How would you like to celebrate this 50th year?
"An Idea of Exhibition (of posters most probably) on Design could be a Good part of the Celebration of Golden Jubilee of this Institute (climate change). Should happen around January-February."
"Partner with three-four organization and to publish 15-20 projects through out the years"
"Exhibition can also do but then it need to travel to many places. Also it may require
poster and catalogs for it and it also needs to reach out to the public"
"Publish course documentation conducted by various pioneer faculties.ex- ‘retrospective’ by Gajanan Upadhyay, courses on color-n-composition by Madhurima Patil."
"NID has a major contribution in Indian festivals that happened abroad. There were a series of exhibitions in the seventies and eighties. Re-exhibiting these."
What you expect to see in a Website on NID’s Golden Jubilee Website?
"A forum or community on the placements and external training where the designer put their comments."
"It should reflect elegance, style and a good navigation."
"The Golden Jubilee Website should reflect some ‘design outlook’ so that people might realize that it is a design institute."
"Memorable and revolutionary works
"speak about people who belonged to NID and did a break through in the design world."
"Success story of the institute."
"A tribute to them because of whom NID is still holding its head high."
I referred many books and journals about the institute, about it's inception, etc.
I really devoted so much time in reading after my school days.
By referring to the old pictures from the institute archives and repositories, got a better idea of the achievements and all the major & memorable events happened in the past. This would help in recounting old memories for which the institute should be proud of.
Clicking pictures around and in the campus was very much required to capture the present essence of NID, its culture, the space, the architecture... everything. Looking for the elements that people, who have been a part of the institute, can connect to.
Interviews with people who is and been a part of this institute for a longer time
How would you know much about the glory years? Obviously- the people, who were an integral part of the institute may be-
the professors who is sharing his knowledge since more than 20 years, the workers like- gardeners who all were working there since ages. And off-course, the students those are the life of this body.
From each of the roles, I assumed that I would get a different P.O.Vs.
From teachers: Educational
From workers: Structural
From students: Fun and Frolic (may be pertaining to events or participation various creative endeavors.)
Received appropriate labels for celebration from the personal interviews conducted and some close ended questions are prepared for the survey
The survey questions were sent across to all the people who are connected a way or the other to the institute.
The majority of the survey questions were close-ended to get quantitative results which would actually lead me to prioritize the purpose for my website.
This was required especially for developing the theme...
I was quite careful here because this was not the 'priority of the content' I was talking about...
India Report: Charles Eames mentioned that Lota is an Indian design which no body has created but has been evolved since age.
Based on the interviews and understanding all the probable users,
6 profiles were discussed. Referring these profiles, relevant personas were created.
After plotting the six different personas, the scenarios for each of them were defined and then their user goals were identified.
Forming Content Type
To know about the
events, workshops and conferences in the 50th year.
To know about the history of NID and its works in the past which was a success.
To know about NID’s vision and promises.
To check how it is different from the actual/ main website.
To check how the premier institute is celebrating its Golden Jubilee.
To showcase the memorable achievements of the past.
To Inform about the events, workshops and conferences in the 50th year.
To reflect its gallant existence and its contribution to the society.
To project NID’s vision and promises.
To promote the institute.
User Goals + Business Goals
Why people would like to see on the GJ website?
What you want to show on the GJ website?
(except people from administration)
(people from administration like the Chairperson and Director)
- Being a part of the Golden Jubilee Celebration.
- To attend the special events during the year.
- To know what is special about NID.
- To get a glimpse of the institute’s golden history.
Nalin's Intended tasks:
- To get the event information
- To register to the Event
Kalpana's Intended tasks:
- To look into the history and the achievements
- To get the perspectives from various eminent people
A parallel effort was given with help of card sorting method for the categorization of the content.
- A section for Events' Details
- A section where user can register; Registration form
- A section where the timeline and the achievements
can be viewed
- A section where a celebrity speaks about the institute;
Frame of Reference/ Celebrity-Word section
Prioritization based on User Goals:
1. Events Details section,
Timeline and Past Event Information,
2. Frame of Reference section
3. Registration form
Prioritization based on Business Goals:
1. Events Details section,
Frame of Reference section,
Timeline and Past Event Information
" The institute is quite known to me...
Just that I want to get more inspired... "
" I am very eager to attend the events... and interested to know the new turns in the conventional design thinking...
I consider this Golden Jubilee as a symbol for evolution of a new design gene in the world of new challenges and technology."
" I always waited for this day to come where all will meet and we celebrate being part of this design history...."
“Well, now I am currently in the colors of the industry. But I seriously miss the design atmosphere at NID.”
“My learning at NID has been fun. I am glad to be a part of design-learning from an Indian cultural perspective.”
“I mostly witnessed the years of design of this institute. I am really proud to be a part of this...”
“NID is a dream to me. I regularly follow the design articles and inch-by-inch I get more curious to know about NID.”
" Certainly this event is going to be a
great one. And hope that the speakers
would certainly lead us to a new
perspective of design thinking..."
“I am getting the hang of the core design learning process. I wish to know the industrial relevance of the process we follow...”
Event Details section was given the first order priority for navigation as per the goals of the two personas shown.
About the Subject
Inspirations were drawn from various Commemorative websites.
No much commemorative sites were found. The website that I referred had to be institutional so that I could get an idea of the kind of content for such sites. One of such sites were Golden Jubilee of IIT-Kanpur. Not much could be gained from the aesthetic sense of the website.
Design websites were compared in terms of Content and Structure, Style of Navigation, etc.
Being this a commemorative website for a design school, it should meet the standards of other design bodies. Hence, all possible institutional and design websites were plotted in the terms of Content structure, Style of navigation, Navigation flow, Simplicity and Visual appeal. inspirations were drawn from all the possible aspects of the websites.
When it was realized that we have enough data in the right direction to set-off, the process of design building was then initiated.
Building a Site Structure based on task prioritization
Keeping the first order priority in mind, the sorted labels were set in a hierarchy.
1st Indian design inst.
Contribution to Design
Initial Keywords on the Golden Jubilee of NID
Filter 2: Matching choices of the themes with the keywords below.
Big tree- GG square
Machinery and Workshops
Research and Publication
NID cells in India
ICSID & UNIDO
1st convo- Ravi Matthai
National Design Policy
Choices for the themes
Theme decided: The big tree
While thinking of the Big Tree, I was trying to draw an analogy between the navigation menus and the forms of the branches. So finally, the functional metaphor for the main menu was chosen: The branches of the Big Tree.
Low-fidelity wireframe to form the layout to fit the navigation module.
Low-fidelity wireframe to look at the positioning of the main-menu function.
Initial explorations on the visual navigation
The Main Menu
Timeline was another kind of navigation menu. When it is said so, it means that each unit (year) has to be clickable which will direct the user to the related page.
Connecting the tree to the institute from various aspects.
So, the timeline means the depiction of the history on a single line of time. And when we say history, it means the AGE of an object. How probably, the age of the tree can be represented? – Yes, I got it !
'The Annual Rings'
Leaves of the Big-tree were re-created in vector referring to photographs and an actual leaf.
Highlighting by blurring the rest and to achieve a depth of field and a parallax effect
Rotation of the tree trunk on the touch of a branch or a leaf.
Labeling the leaves corresponding to the menu options which was structured.
On year-range selection on the timeline, the corresponding annual ring gets highlighted
sub-menus in the form of branches
Enshrouding the negativity:
the transverse section of the tree
A validation on how the probable users would navigate through the page actually.
Testing the Site-Flow: Paper Prototyping
Once the high-fidelity wireframes are ready, the paper-prototyping was conducted to validate the flow of pages which were created.
It is situated at the Gautam Girabhai Square in National Institute of Design, Ahmadabad is known for being the oldest tree witnessed the whole fifty year of the institute.
Common Name: Badminton Ball Tree, African locust tree, Gong-Stick Tree.
TADA..!! That was it ! :)
Thanks for watching.
Final Skinning of the Website
Filter 1: USP of NID. What is special about NID?
To structure the information architecture of the website.
To define a theme that could be taken forward in various collateral.
1st Indian design inst.
Contribution to Design
Big tree- GG square
After many rounds of explorations, the final set of wireframes were sketched.
Three months for submitting the final design.
There were no work happened similar to such a project.
Linear flows also got spotted out where there are no options to jump to a different page.
Spotted the major flows and navigation paths.
Missing functions were figured out like there was no immediate options for going back at a certain pages.
Staff and other people who had been a part of NID for a longer time