GRADUATION PROJECT BRANDING & RESPONSIVE WEBSITE FOR FIND Sponsor: Heckyl Technology Pvt. Ltd. Volume : 1 of 1 STUDENT : GAUTAM GAIKWAD PROGRAMME : MASTERS OF DESIGN GUIDE : RUPESH VYAS
2016 VISUAL COMMUNICATION DESIGN (GRAPHIC DESIGN)
Copyright Š2016 Students document publication meant for private circulation only. All rights reserved. Masters of Design, Graphic Design, 2013-2016 National Institute of Design, Ahmedabd, India No part of this document will be reproduced or transmitted in any form or by any means including photocopying, xerography, photography and videography recording without written permission from the publisher, Gautam Gaikwad and National Institute of Design. All illustrations and photographs in this document are Copyright Š2016 by respective people /organizations. Edited and designed byGautam Gaikwad gautam.design87@gmail.com Processed at National Institute of Design (NID) Paldi, Ahmedabad - 380007 Gujarat, India. www.nid.edu Printed digitally in Ahmedabad, India. November, 2016
The Evaluation Jury recommends GAUTAM GAIKWAD for the Graduation of the National Institute of Design IN VISUAL COMMUNICATION DESIGN (GRAPHIC DESIGN) herewith, for the project titled "BRANDING & RESPONSIVE WEBSITE FOR FIND" on fulfilling the further requirements by *
Chairman
Members :
*Subsequent remarks regarding fulfilling the requirements :
Activity Chairperson, Education
COPYRIGHT STATEMENT I hereby grant the National Institute of Design the right to archive and to make available my graduation project / thesis / dissertation in whole or in part in the Institutes Knowledge Management Centre in all forms of media, now or hereafter known, subject to the provisions of the Copyright Act. I have either used no substantial portions of copyright material in my document or I have obtained permission to use copyright material.
Student Name in Full: Gautam Gaikwad Signature: Date:
ORIGINALITY STATEMENT I hereby declare that this submission is my own work and it contains no full or substantial copy of previously published material, or it does not even contain substantial proportions of material which have been accepted for the award of any other degree or final graduation of any other educational institution, except where due acknowledgment is made in this post graduation project. Moreover I also declare that none of the concepts are borrowed or copied without due acknowledgment. I further declare that the intellectual content of this post graduation project is the product of my own work, except to the extent that assistance from others in the project’s design and conception or in style, presentation and linguistic expression is acknowledged. This post graduation project (or part of it) was not and will not be submitted as assessed work in any other academic course.
Student Name in Full: Gautam Gaikwad Signature: Date:
6 |National Institute of Design
Synopsis Heckyl Technology is the one of the leading data analytical company. Introducing Find terminal, which provides news and analytics data. Main focus of project is make strategy branding and web experience for FIND. All relevant information that helps the user to understand more about the product.
Gautam Gaikwad | Graphic Design |M. Des | 7
8 |National Institute of Design
Acknowledgment This internship opportunity I had with Heckyl Technology, Mumbai was an enriching experience. I am grateful for having a chance to meet wonderful people. Bearing this in mind, I would like to express my deepest gratitude to Mr. Mukund Mr. Som and team. I would also like to express my gratitude to my project Guide Prof. Rupesh Vyas for his support and encouragement throughout the project term. I extend my gratitude National Institute of Design for giving me this opportunity. I also thank all the faculties at NID who helped me in many ways to finish this project, Specially Dr. Tridha Gajjar and Tarundeep Girdhar. I also acknowledge with deep sense of reverence, my gratitude towards my parents and my brother, who have always supported me morally as well as economically. At last but not least, gratitude to all my friends Karamu, Gagan, Dinesh, Nandana, Pooja, Pavan, Vihang, Adarsh, Anik, Aakta and my senior Smita, Jishnu, Ashutosh who directly or indirectly helped me to complete this project report. Any omission in this brief acknowledgement does not mean lack of gratitude. Gautam Gaikwad | Graphic Design |M. Des | 9
Phase 1
Phase 2
Phase 3
Introduction
Understanding the Context
Initial Research
National Institute of Design
15
Overview of Indian Stock Market
28
Graphic Design
17
An Introduction to the Indian Stock
29
About Guide
19
How a Stock Exchange Works
30
About Sponsor
21
Competitors
31
Initial Project Proposal
22
Analysis and Insights
33
Redefined Project Proposal
23
Project Time Line
24
Content 10 |National Institute of Design
Brand World
36
Brands in Consumer Market
37
Brand Basics
38
What Makes a Good Logo?
41
Case Studies
44
Brands Functions
52
Brand Touch Points
53
Phase 4
Phase 5
Phase 6
Scenario Development
Design Concept Explorations
Identity Construction
Thinking on Paper
71
Final Logo
91
Design Direction 1
72
Elements and Principles of Design
93
Design Direction 2
77
Logo Architecture
94
Design Direction 3
83
Logo Grid
95
Design Approach
85
Colour Options
96
User Feedback
87
Logo in Single Colour and Reverse
99
Methodology
57
Identity Style Guides
100
What’s in the Name?
58
Typeface
101
Design Process
58
Minimum Size
102
Important Questions
59
Corporate Identity
103
User Study
60
Final Deliverable
107
User Information sources
61
Mind Mapping
62
Brand Positioning
63
Phase 7
Mood-board
65
Conclusion
The Gestalt Principles
67
Conclusion
111
Future Directions Gautam Gaikwad | Graphic Design |M. Des | 11
12 |National Institute of Design
1
Introduction National Institute of Design Graphic Design About Guide About Sponsor Initial Project Proposal Redefined Project Proposal Project Time Line
Gautam Gaikwad | Graphic Design |M. Des | 13
14 |National Institute of Design
National Institute of Design The establishment of NID was a result of several forces, both global and local. The late 1950s saw a confluence of these forces, and the time to follow would be a significant one for Indian culture and education. In 1957 the Government of India requested the Ford Foundation to invite Charles and Ray Eames to visit India. Charles and Ray Eames travelled to all parts of the country, meeting writers, craftspeople, architects, educators and philosophers in order to write the India Report. The Eames Report defined the underlying spirit that would lead to the founding of NID and beginning of design education in India. The Report recommended a problem solving design cosciousness that linked learning with actual experience
and suggested that the designer could be a bridge between tradition and modernity. Based on the recommendations made in the India Report, the Government of India with the assistance of the Ford Foundation and the Sarabhai family esta lished the National Institute of Industrial Design, as it was originally called as an autonomou all-India body in September 1961 at Ahmedabad. Gautam and Gira Sarabhai revived the philosophy of the Bauhaus design movement which was learning by doing in NID. This unique curriculum and revolutionary educational philosophy remain part of the institute to the present day. Today the National Institute of Design is internationally acclaimed as one of the finest
educational and research institutions for Industrial, Communication, Textile and IT Integrated (Experiential) Design. NID also anchors itself to cultural strengths of India and fosters strategic design linkages of innovation and entrepreneurship with the various sectors of industry. The institution lays emphasis on learning and pursuing innovation led designs through the development of the mind and skills of designers. This technique motivates students to perform better and gives them an edge over other design professionals. With these learnings and exposure, NID graduates have played the role of a catalyst in development across industries in India and abroad.
Gautam Gaikwad | Graphic Design |M. Des | 15
16 |National Institute of Design
Graphic Design Visual culture is a combination of innumerable messages and images, from the past and present. The design of messages, in the form of text, image, and now moving images is the role of the graphic designer. Graphic design plays many roles, as an effective information-dispenser, communicator and persuader. Technology and mediums are rapidly changing a way the graphic designer works, but basic principles of good design hold strong. Besides aesthetic considerations, graphic design encompasses contemporary culture, media, research, analysis, and critical
judgment. Development of conceptual thinking as well as traditional design skills are given equal emphasis during the course. Graphic design offers different areas of study as such typography, illustration, publication design, identity design, branding, and information design. It covers a range of work, from sign-age systems to medical leaflets, and educational tools to logos.
Gautam Gaikwad | Graphic Design |M. Des | 17
18 |National Institute of Design
About Guide Rupesh Vyas is professor of practice of visual communication design (information design) at Aalto University. He leads the new (starting fall 2016) information design major at the Department of Media. Previously Vyas was senior faculty at National Institute of Design, Ahmedabad, India, responsible for developing information and interaction design education, among other tasks. Vyas has two decades of experience as an educator, researcher and design practitioner. He has contributed significantly to a variety of major projects with national importance in India, including the 2011 census, rollout of the Multipurpose National Identity Card, and national level visual standards for Drivers’s Licence. He is the World Regional Representative of International Institute of Information Design (IIID) in India.
Gautam Gaikwad | Graphic Design |M. Des | 19
20 |National Institute of Design
About Sponsor Heckyl Technologies is a fin-tech company bringing real-time data analytics for the financial markets. Using its proprie-tary technology Heckyl brings real-time news, information and data from companies, businesses and global markets to offer retail and institutional traders with actionable ready-to-use intelligence in a fast-moving market.
The real-time data analytics platform that transforms raw news, structured and unstructured data, and facts and figures into actionable insights for market researchers, traders and analysts. Heckyl considers the entire web its source for news, information and market data related to companies, businesses and global markets.
Heckyl’s flagship product is FIND or Financial in News and Data, a comprehensive analytics platform offering real-time insights for trad-ing opportunities. FIND consists of a bouquet of products covering news, price and fundamental data for various asset classes and offers detailed analytics at a portfolio, brokerage and user framework level. The platform is not only capa-ble of connecting the real-time news flow, price data and fundamentals with various asset classes but it can also con-nect the various silos (CXOs, regional heads, research, sales) that exist within a financial organization. Founded in De-cember 2010 and with offices in India and UK, more than 800,000 traders.
Heckyl’s analytical platform - FIND- features various analytical tools on News, Sentiment, Markets, Global Market Trends and Predictive Data Analysis.
Heckyl is India’s leading news and data analytics company with mareque clients like Sunguard, Reliance, Kotak and Religaire. Gautam Gaikwad | Graphic Design |M. Des | 21
Initial Project Proposal About:
Heckyl is India’s leading news and data analytics company with mareque clients like Sunguard, Reliance, Kotak, Religaire. The real-time data analytics platform that transforms raw news, structured and unstructured data, and facts and figures into actionable insights for market researchers, traders and analysts. Heckyl considers the entire web its source for news, information and market data related to companies, businesses and global markets. Heckyl’s analytical platform - FIND- features various analytical tools on News, Sentiment, Markets, Global Market Trends and Predictive data Analysis.
Initial Project Brief:
Project: UX/UI for Heckyl’s Product -Terminaland Design Strategy for Heckyl’s Product Credit Risk/Terminal Terminal is a knowledge web platform (mega site) Where user gets market insights in depth.
22 |National Institute of Design
Key Deliverables: Brainstorming on Design
- (concept/patterns) of product - Wireframe/Mockups for Web app - Data Visualization according to existing design patterns - Visualization for analytics/research
Concept generation and execution of: - Website - Brochures - Weekly Mailers
Redefined Project Proposal Project Brief:
Heckyl’s analytical platform - FIND - features various analytical tool on News, Sentiment, Market, Global Market Trends and Predictive Data. Heckyl needed to promote it’s Product and wanted to introduce it in market. For that, Heckyl needed Branding and Strategy for FIND.
Objective:
Understand the domain. Understand the target audience and different kinds of stakeholders. To understand the user experience for prospective users.
Methodology :
1.Market Study 2. Stakeholder Study 3. Analysis and Thorough Study of the Collected Data. 4. Findings 5. Conclusion 6. Content Generation 7. Exploration and Concept Generation 8. Testing 9. Final Concepts and Design 10. Final Deliverable
Gautam Gaikwad | Graphic Design |M. Des | 23
Time-line Synthesis
Branding Analysis
Scenario Development
Research
Start Week1
Week2
Week3
Week4
Week5
Week6
Week7
Week8
Week9
Week10
Week11
Research Site Outline Site Map
Website
Wire-frames Content Outline
24 |National Institute of Design
Week12
Concepts Explorations
Identity Construction
Conclusion Week13
Week14
Week15
Week16
Week17
Week18
Week19
Week20
Week21
Week22
Week23
Week24
Launch Coding Refinement Validation
Landing Page Artwork
Gautam Gaikwad | Graphic Design |M. Des | 25
26 |National Institute of Design
2
Understanding the Context Overview of Indian Stock Market An Introduction To The Indian Stock Market How a Stock Exchange Works Competitors Analysis and Insights
Gautam Gaikwad | Graphic Design |M. Des | 27
Overview of Indian Stock Market The Bombay Stock Exchange is the oldest exchange in Asia. Its history dates back to 1855, when five stockbrokers would gather under banyan trees in front of Mumbai’s Town Hall. The location of these meetings changed many times to accommodate an increasing number of brokers. The group eventually moved to Dalal Street in 1874 and it became an official organization known as “The Native Share & Stock Brokers Association” in 1875. On August 31, 1957, the BSE became the first stock exchange to be recognized by the Indian Government under the Securities Contracts Regulation Act. In 1980, the exchange moved to the Phiroze Jeejeebhoy Towers at Dalal Street, Fort area. In 1986, it developed the BSE SENSEX index, giving the BSE a means to measure the overall performance of the exchange. In 2000, the BSE used this index to open its derivatives market, trading SENSEX futures contracts. The development of SENSEX options along with equity derivatives followed in 2001 and 2002, expanding the BSE’s trading platform.
28 |National Institute of Design
Historically an open outcry floor trading exchange, the Bombay Stock Exchange switched to an electronic trading system developed by CMC Ltd. in 1995. It took the exchange only 50 days to make this transition. This automated, screen-based trading platform called BSE OnLine Trading (BOLT) had a capacity of 8 million orders per day. The BSE has also introduced a centralized exchange-based internet trading system, BSEWEBx.co.in to enable investors anywhere in the world to trade on the BSE platform. The BSE is also a Partner Exchange of the United Nations Sustainable Stock Exchange initiative, joining it in September 2012.
An Introduction To The Indian Stock Market
India may look like a small dot to someone in the U.S., but upon closer inspection, you will find the same things you would expect from any promising market. Here’s an overview of the Indian stock market and how interested investors can gain exposure.
90% of its market capitalization; the rest of the crowd consists of highly illiquid shares. Almost all the significant firms of India are listed on both the exchanges. NSE enjoys a dominant share in spot trading, with about 70% of the market share, as of 2009, and almost a complete monopoly in derivatives trading, with about a 98% share in this market, also as of 2009. Both exchanges compete for the order flow that leads to reduced costs, market efficiency and innovation. The presence of arbitrageurs keeps the prices on the two stock exchanges within a very tight range. (To learn more, see The Birth Of Stock Exchanges.)
The BSE and NSE Most of the trading in the Indian stock market takes place on its two stock exchanges: the Bombay Stock Exchange (BSE) and the National Stock Exchange (NSE). The BSE has been in existence since 1875. The NSE, on the other hand, was founded in 1992 and started trading in 1994. However, both exchanges follow the same trading mechanism, trading hours, settlement process, etc. At the last count, the BSE had about 4,700 listed firms, whereas the rival NSE had about 1,200. Out of all the listed firms on the BSE, only about 500 firms constitute more than
Trading Mechanism Trading at both the exchanges takes place through an open electronic limit order book, in which order matching is done by the trading computer. There are no market makers or specialists and the entire process is order-driven, which means that market orders placed by investors are automatically matched with the best limit orders. As a result, buyers and sellers remain anonymous. The advantage of an order driven market is that it brings more transparency, by displaying all buy and sell orders in the trading system. However, in the absence of market
Mark Twain once divided the world into two kinds of people: those who have seen the famous Indian monument, the Taj Mahal, and those who haven’t. The same could be said about investors. There are two kinds of investors: those who know about the investment opportunities in India and those who don’t.
makers, there is no guarantee that orders will be executed. All orders in the trading system need to be placed through brokers, many of which provide online trading facility to retail customers. Institutional investors can also take advantage of the direct market access (DMA) option, in which they use trading terminals provided by brokers for placing orders directly into the stock market trading system. (For more, read Brokers And Online Trading: Accounts And Orders.) Settlement Cycle and Trading Hours Equity spot markets follow a T+2 rolling settlement. This means that any trade taking place on Monday, gets settled by Wednesday. All trading on stock exchanges takes place between 9:55 am and 3:30 pm, Indian Standard Time (+5.5 hours GMT), Monday through Friday. Delivery of shares must be made in dematerialized form, and each exchange has its own clearing house, which assumes all settlement risk, by serving as a central counterparty. An Introduction To The Indian Stock Market | Investopedia http://www. investopedia.com/articles/stocks/09/
Gautam Gaikwad | Graphic Design |M. Des | 29
How a Stock Exchange Works
30 |National Institute of Design
Competitors
Moneycontrol is India’s leading financial information source. Manage your finance with our online Investment Portfolio, Live Stock Price, Stock Trading news. Moneycontrol offers markets on mobile apps through which you can easily track real-time stock quotes, portfolio, CNBC live TV with personalized stock ticker.
Bloomberg L.P. is a privately held financial software, data, and media company headquartered in Midtown Manhattan, New York City. Bloomberg L.P. was founded by Michael Bloomberg in 1981.
Angel Broking is an Indian Stock Broking firm established in 1987. The company is a member of the Bombay Stock Exchange, National Stock Exchange, National Commodity & Derivatives Exchange Limited and Multi Commodity Exchange of India Limited.
IIFL Holdings Limited (formerly known as India Infoline Limited) is an Indian financial services company which is headquartered in Mumbai, India. The organisation was founded by Nirmal Jain.
MarketWatch operates a financial information website that provides business news, analysis, and stock market data.
Thomson Reuters provides professionals with the intelligence, technology that matter most, all powered by the world’s most trusted news organization.
Gautam Gaikwad | Graphic Design |M. Des | 31
32 |National Institute of Design
Analysis and Insights The study was done on the various features of the competitors. Their all of it vision, philosophy, color, scheme, according to the target audience. Logos are not so colorful. it is either in a single color or two colors. The IIFL Logo comprises of the nine triangles which form the Sri Yantra. In Hindu Mythology, the nine interlocked triangles that surround and radiate from the center (Bindu) symbolize the highest, the invisible and elusive center from which the entire cosmos expands.
In the Angel Broking logo, Pyramid formation symbolizes steady growth. Blocks of triangles stand for teamwork. The triangle structure showcases their network strength. The structure reflects Alphabet “A” for Angel. Green Band indicates a customer supportive Unit. Green signifies wealth creation. Yellow signifies wealth creation. Yellow signifies continuous growth and Radiance. Yellow+Greenmerge in blue - Corporate color Where blue Signifies Prosperity.
IIFL brand represents the cosmos in itself, where two worlds meet. One, where we together strive to grow and expand and the other, where we strive to make possibilities infinite for customers. It is the confluence of these two thoughts, represented by the age-old symbol of converging powers that stands as the face of our brand. In the Thomson Reuters logo, conceptually each of the dots represents a point of data, so the story is that Thomson Reuters organizes the data to give it shape and meaning. Even at rest, the shape has a feeling of being alive and in motion, and supports the notion that ‘intelligent information is alive’. Gautam Gaikwad | Graphic Design |M. Des | 33
34 |National Institute of Design
3
Initial Research Brand World Brands in Consumer Market Brand Basics What Makes a Good Logo? Case Studies Brands Functions Brand Touch Points
Gautam Gaikwad | Graphic Design |M. Des | 35
Brand World A Brief History of Branding The term branding comes from the Old Norse “Brandr” which means to burn. Cattle, slaves, timber and crockery were burnt or branded with the markings or symbols of the owner using a hot iron rod. The concept of branding was essentially to depict ownership, in particular things which had value, this practice dating back to 2000BC. The transition from “This belongs to me, so leave it…” to “This was made by me, so buy it” started to evolve in the 1800’s. Towards the end of the 19th century, we see a massive shift in attitudes to products and purchasing of things. This push was led by a collection of new technology and methods of communication such as the invention of mail order catalogues, the advancement of railroads and the expansion of the postal service. These things combined allow people for the first time in history access to things not within their reach. Mail order catalogues, also known as wish books, gave aspiring people the ability to shape their homes and environment. The population was empowered to buy status. And by the 1920’s, especially in the west, society evolved from a culture of need to a culture of desire. 36 |National Institute of Design
The end of the Second World War saw a manufacturing boom as many factories which were set up in order to produce military equipment could now be used to make products. With the facility for mass production now in place coupled with access to markets years’ earlier production for brands could now reach and produce for almost anyone.
Brands in Consumer Market
Gautam Gaikwad | Graphic Design |M. Des | 37
Brand Basics What is Logo, Brand and Identity? A logo is not your brand, nor is it your identity. Logo design, identity design and branding and branding all have different roles, that together, form a perceived image for business or product. There has been some recent discussion on the web about this topic, about your logo not being your brand. Although this may be true, I haven’t seen any clarification of the differences between ‘brand’, ‘identity’, and ‘logo’.
What is logo?
A logo identifies a business in its simplest form via the use of a mark or icon.
What is brand?
The perceived emotional corporate image as a whole.
What is identity?
The visual aspects that form part of the overall brand.
38 |National Institute of Design
What is logo? The word logo is short for logotype, which is defined as “a graphic representation or symbol of a company name, trademark, abbreviation, etc., often uniquely designed for ready recognition.” Logos are either purely graphic (symbols/icons) or are composed of the name of the organization (a logotype or word mark). So essentially, a logo is a picture that represents the collection of experiences that form a perception in the mind of those who encounter an organization.
Logo
Brand
What is brand? Brand is a “Name, term, design, symbol, or any other feature that identifies one seller’s good or service as distinct from those of other sellers.” A brand can take many forms from a name, symbol, colour palette or even a slogan. The word has continued to evolve and now encompasses the word identity because it affects the personality of a product, company or service and is defined by a perception, good or bad, that your customers have about your business. Essentially, your brand helps to shape your identity. See how the logo is just the tip of the iceberg. It’s the only visual clue above the water showing passer-by’s that there’s something here. Now look at how much mass is below the water. This is what the entire brand represents. A visual structure of everything associated with a business.
What is identity? Identity is something that’s different from a logo but, unfortunately is commonly mistaken as one. An identity is something that encompasses more than just logo. it is a culmination of all the visual and nonvisual elements that make up a company, business or individual. Everything from their name to their logo, business cards, website design, packaging or even in-store experiences. It encompasses the entire experience as a whole. All of these things make up an identity and should support the brand as a whole. The logo however, is the corporate identity and brand all wrapped up into one identifiable mark. This mark is the avatar and symbol of the business as a whole.
Gautam Gaikwad | Graphic Design |M. Des | 39
Simple • Memorable • Timeless • Versatile • Appropriate
40 |National Institute of Design
What Makes a Good Logo? A good logo is distinctive, appropriate, practical, graphic, simple in form and conveys an intended message. There are five principles that you should follow to ensure that this is so. An effective logo is (in no particular order): Simple • Memorable • Timeless • Versatile • Appropriate
1. SIMPLE A simple logo design allows for easy recognition and allows the logo to be versatile & memorable. Good logos feature something unique without being overdrawn. Simple logos are often easily recognized, incredibly memorable and the most effective in conveying the requirements of the client. A refined and distilled identity will also catch the attention of a viewer zipping by signage at 70 miles per hour, on packaging on the crowded shelves of a store, or in any other vehicle used for advertising, marketing and promotion. Remember, the basis of the hugely effective international branding for the world’s largest shoe manufacturer is a very simple graphic swoosh.
2. MEMORABLE Following closely behind the principle of simplicity, is that of memorability. An effective logo design should be memorable and this is achieved by having a simple, yet, appropriate logo. Surprising to many, the subject matter of a logo is of relatively little importance, and even appropriateness of content does not always play a significant role. This does not imply that appropriateness is undesirable. It merely indicates that a one-to-one relationship between a symbol and what it symbolized is very often impossible to achieve and, under certain conditions, objectionable. Ultimately, the only mandate in the design of logos, it seems, is that they be distinctive, memorable and clear.
http://justcreative.com/2009/07/27/what-makes-a-good-logo/ Gautam Gaikwad | Graphic Design |M. Des | 41
3. TIMELESS An effective logo should be timeless – that is, it will endure the ages. Will the logo still be effective in 10, 20, 50 years? Probably the best example of a timeless logo is the Coca-Cola logo. If you compare it to the Pepsi logo below, you can see just how effective creating a timeless logo can be. Notice how the Coca Cola logo has barely changed since 1885? That is timeless design.
42 |National Institute of Design
4. VERSATILE An effective logo should be able to work across a variety of mediums and applications. The logo should be functional. For this reason a logo should be designed in vector format, to ensure that it can be scaled to any size. The logo should be able to work both in horizontal and vertical formats. Ask yourself; is a logo still effective if: • Printed in one colour? • Printed on the something the size of a postage stamp? • Printed on something as large as a billboard? • Printed in reverse One way around creating a versatile logo is to begin designing in black and white only. This allows one to focus on the concept and shape, rather than the subjective nature of colour. One must also remember printing costs – the more colours used, the more expensive it will be for the business over the long term.
5. APPROPRIATE How you position the logo should be appropriate for its intended purpose. For example, if you are designing a logo for children’s toys store, it would be appropriate to use a childish font & colour scheme. This would not be so appropriate for a law firm. It is also important to state that a logo doesn’t need to show what a business sells or offers as a service. ie. Car logos don’t need to show cars, computer logos don’t need to show computers. The Harley David son logo isn’t a motorcycle, nor is the Nokia logo a mobile phone. A logo is purely for identification.
Gautam Gaikwad | Graphic Design |M. Des | 43
Case Studies MIT Media Lab identity MIT Media Lab identity change followed on the heels of its 25th anniversary: Founded in 1985 by MIT (Massa-chusetts Institute of Technology) Professor Nicholas Negroponte and former MIT Pres-ident Jerome Wiesner in an I.M. Pei-designed building, the MIT Media Lab is one of the world’ s most renown research and development centers. Funded by corporate sponsorship, the Media Lab counts with an annual operating budget of approximately $45 million and served 146 graduate students and 28 faculty and principal investigators in 2013 – 14, who work in more than 25 research groups on more than 350 projects that range from “digital approaches for treating neurological disorders, to a stackable, elec-tric car for sustainable cities, to advanced imaging technologies that can ‘see around a corner.’” Earlier this month, the Media Lab introduced a new identity by Pentagram, headed by New York, NY-based partner Michael Bierut.
44 |National Institute of Design
Gautam Gaikwad | Graphic Design |M. Des | 45
Michael Bierut (born 1957) is a graphic designer, design critic and educator. Bierut was born in Cleveland, Ohio. He studied Graphic Design at the University of Cincinnati’s College of Design, Architecture, Art and Planning.
Michael Bierut
46 |National Institute of Design
Bierut was Vice President of graphic design at Vignelli Associates. Since 1990 he has been a partner in the New York office of Pentagram. According to his Pentagram online biography: Bierut “is responsible for leading a team of graphic designers who create identity design, environmental graphic design and editorial design solutions. He has won hundreds of design awards and his work is represented in several permanent collections including: the Museum of Modern Art (MoMA) and the Cooper-Hewitt, National Design Museum in New York; the Library of Congress in Washington, DC; the San Francisco Museum of Modern Art (SFMOMA); the Denver Art Museum; the Museum für Kunst und Gewerbe Hamburg, Germany; and the Museum für Gestaltung in Zürich, Switzerland.”
Bierut served as the National President of the American Institute of Graphic Arts (AIGA) from 1998 to 2001. Bierut is a senior critic in graphic design at the Yale School of Art. Bierut is also the co-editor of three Looking Closer graphic design anthologies. He is also a founding writer of the Design Observer blog with Rick Poynor, William Drenttel and Jessica Helfand.Bierut currently serves on the governing board of the Bulletin of Atomic Scientists; in January, 2007, he redesigned the Bulletin’s Doomsday Clock to give it a more modern feel. Bierut is also known for his involvement in the film Helvetica.
Gautam Gaikwad | Graphic Design |M. Des | 47
NeXT, Inc. (later NeXT Computer, Inc. and NeXT Software, Inc) was an American computer company. NeXT was founded in 1985 by Apple Computer co-founder Steve Jobs.
48 |National Institute of Design
One reason for looking at a number a number of possible typefaces is to satisfy one’s curiosity. Another, and perhaps more meaningful one, is so study the relationship of different letter combinations, to look for visual analogies, and to try to elicit ideas that the design of letter or group of letters might inspire. Here are some further choices, but no matter how one may look at these different examples - sans serifs, hairline and slab serifs, condensed,expanded, bold, light, outline - they still say next ...like next time? next in line, or even next of kin. The word is in such common usage that it is simply taken for granted. Personal preferences, prejudices, and stereotypes of ten dictate what a logo looks like, but is need not wants, ideas not type styles that determine what its from should be. To defamiliarize it, to make it look different, to let it evoke more than the mere adjective or adverb it happens to be is, it seems, the nub of the problem.
Gautam Gaikwad | Graphic Design |M. Des | 49
Paul Rand (August 15, 1914 – November 26, 1996) was an American art director and graphic designer, best known for his corporate logo designs, including the logos for IBM, UPS, Enron, Morningstar, Inc., Westinghouse, ABC, and NeXT. He was one of the first American commercial artists to embrace and practice the Swiss Style of graphic design.
Paul Rand
50 |National Institute of Design
Rand was a Professor Emeritus of Graphic Design at Yale University in New Haven, Connecticut from 1956 to 1969, and from 1974 to 1985. He was inducted into the New York Art Directors Club Hall of Fame in 1972.
Gautam Gaikwad | Graphic Design |M. Des | 51
Brands Functions Brands have three primary Functions Knowing these basic fact helps a lot in brainstorming, it helps the initial stage of conceptualization, direction of research to make better connections, which would be helpful for generate ideas. Brands have tree primary functions 1. Navigations Brands helps consumers choose from a confusing range of choice. 2. Reassurance Brand communicate the instinct quality of the product or service and reassure customers that they have made the right choice. 3. Engagement Brands use distinctive imagery and the to encourage the customer to identify with the brand. *David Haigh, CEO, Brand Finance
52 |National Institute of Design
Navigations
Brand Reassurance
Engagement
Brand Touch Points Employees
Vehicles
Ephemera Networking Billboards
Sales Promotion
Direct Mail
Telephone
Letterheads Advertising
Voice Mails
Products
Brand Touch Points Publications
Word of mouth
Social Media
Web Banner
Blogs Public Relations
Proposals Business cards
Emails
Services
Speeches
Trade Shows
Presentations
Gautam Gaikwad | Graphic Design |M. Des | 53
54 |National Institute of Design
4
Scenario Development Methodology What’s in the Name? Design Process Important Questions User Study Mind Mapping Brand Positioning Mood-board The Gestalt Principles
Gautam Gaikwad | Graphic Design |M. Des | 55
56 |National Institute of Design
Methodology The project begins with a mind mapping session in order to bring out fundamental concepts based on the product keywords ‘Discovery’ and the visual communication methods of similar brands. The primary research is followed by the study of the target group and identities related to them. This will be followed by visual exploration and refinement of selected concepts and visuals. A study on colours and other finer aspects will be done before the final refinements of the visual identity is done. A visual brand language is established in order for brand communications. Documentation of all the processes will be carried out simultaneously and compiled at the end of the project.
Gautam Gaikwad | Graphic Design |M. Des | 57
What’s in the Name?
FIND
Financial In News & Data
How they describe themselves: Heckyl FIND (Financial In News & Data) is a real time news and data analytic platform for retail traders and brokerages.
Design Process
1. Initial Research Market and Competitor Research
58 |National Institute of Design
2. Develop and clarify Brand Strategy & Story
3. Designing Brand Identity & Collateral
4. Creating Touch points
5. Managing Assets
Important Questions I was clear about building brand is not just about making a logo. Branding is about building an experience that will stay in the minds of people. Branding is storytelling. And to build a good story, you have to get good understanding of brand.
Logo Design for FIND - Questionnaire
The first session start with discussion about different brands and their strategy behind it.
2- Who are main competitors?
There were many things I needed to know to get better understanding of the brand. So, I prepared a list of questions. That aim is to collect stories, Values, Vision mission of brand that can help build a better brand. Knowing these basic fact helps a lot in brainstorming, it helps into initial stage of conceptualization, direction of research to make better connections, which would be helpful for generate ideas.
1- Why want a new logo? What do you want your new logo to accomplish? (This question helps to understand the problem.)
3- How are you different from your competitors?
9- What adjectives should best describe your logo? (keywords)
10- What feeling or message do you want your logo to convey to those who view it? 11- How would you like the typography to appear? Example: script, bold, light, hand drawn, custom lettering
4- What’s the age range of your target customer base? Helps in creating an overall feeling and impression of the logo. 5- Do you have a tag line? If so, would you like it stated along side your logo? 6- Do you have any specific imagery in mind for your logo? 7- Do you have any color preferences, or existing brand colors? 8- Do you have any colors that you do not wish to use? Gautam Gaikwad | Graphic Design |M. Des | 59
User Study
Purvesh Mehta - Broker, Age - 37
Amit Jain - Analyst, Age - 27
Dhruv Keshan - Trader, Age - 35
Priorities: The most important thing is that I should get an update about financial news or news which impacts the share market. News alerts are important. New application or platform registration should be easy. Easy to get free trials and subscription. Information should be in the crisp format. Less text-more to the point.
Priorities: Application must have important things which helps in understanding company growth. Real-time data, Stock comparison. New application information should be in less time. availlable should be easy to get trial version.
Priorities : Mostly use mobile phone, Information source is mobile phone. Less content about website, mobile is an easy way to find out subscription. Demos and video introductions would be better and less time consuming.
The main resource of news is Newspaper, and mobile News applications, Twitter is prominently used.
The main resource of news Applications, and Twitter, News chanel
The main resource of News Applications, Television and Twitter.
Device used: Smartphone, Desktop
Device used: Smartphone, Desktop
Device used: Smartphones, Desktop
60 |National Institute of Design
Knowledge, Information Web portal TV News Channels
Newspaper - Printmedia
User Information sources
Mobile Applications for news Social Media
Gautam Gaikwad | Graphic Design |M. Des | 61
Mind Mapping
Brainstorming - 1 During my first brainstorming for this project, I listed down. My initial thoughts regarding ‘FIND’ with Meaning,’ with out taking any reference. This helped me to make mood board for my next brainstorming.
62 |National Institute of Design
Brand Positioning Keyword
Brand Philosophy
Keywords
After mind mapping and brainstorming sessions, I was trying to isolate the main keypoints that were crucial in describing the philosophy of FIND.
We strongly believe in delivering what no one can else can- information you can trust. There is always a great story to be told, the potential to unlock something new and an innovation to be discussed.
Informed
We provide news, insights, and expertise by showing a comparison and igniting debates to the believers, creators, influencer and professionals.
Trust- Trusted source
Our working model relies on being open, fair and and transparent about the market.
Discover - Search, Magnifying glass
The idea was to bring down to a few words, in order to have it based on brand philosophy.
Open, Fair Transparent
Confident
Direction - Arrow Growth - Bar graph, Statistics, Arrow
Gautam Gaikwad | Graphic Design |M. Des | 63
Discovery
PURPOSE OF THE IDENTITY
Open Fair
Trust Transparent
Informed
Confident
Trusted source
WORDS ASSOCIATED WITH ATTRIBUTES
Growth Bar graph Statistics Search - Arrow
Magnifying glass
64 |National Institute of Design
Direction - Arrow
After my first brainstorming , I sorted down some words which are associated with ‘FIND’ and I started making a mood board which has visual/ imagery related to those words.
Mood-board
Gautam Gaikwad | Graphic Design |M. Des | 65
The Gestalt Principles Gestalt is a psychology term which means “unified whole”. It refers to theories of visual perception developed by German psychologists in the 1920s. These theories attempt to describe how people tend to organize visual elements into groups or unified wholes when certain principles are applied. These principles are: as follows-
Similarity
Similarity occurs when objects look similar to one another. People often perceive them as a group or pattern.
Unity occurs because the triangular shapes at the bottom of the eagle symbol look similar to the shapes that form the sunburst.
When similarity occurs, an object can be emphasised if it is dissimilar to the others. This is called anomally.
Continuation
Continuation occurs when the eye is compelled to move through one object and continue to another object. The example above (containing 11 distinct objects) appears as as single unit because all of the shapes have similarity. Continuation occurs in the example above, because the viewer’s eye will naturally follow a line or curve. The smooth flowing crossbar of the “H” leads the eye directly to the maple leaf. 66 |National Institute of Design
Closure
Closure occurs when an object is incomplete or a space is not completely enclosed. If enough of the shape is indicated, people percieve the whole by filling in the missing infomation.
Although the panda above is not complete, enough is present for the eye to complete the shape. When the viewer’s perception completes a shape, closure occurs
Proximity
Proximity occurs when elements are placed close together. They tend to be perceived as a group.
The nine squares above are placed without proximity. They are perceived as separate shapes.
When the squares are given close proximity, unity occurs. While they continue to be separate shapes, they are now perceived as one group.
Figure and Ground
The eye differentiates an object form its surrounding area. a form, silhouette, or shape is naturally perceived as figure (object), while the surrounding area is perceived as ground (background). Balancing figure and ground can make the perceived image clearer. Using unusual figure/ ground relationships can add interest and sublety to an image.
Figure
The word above is clearly perceived as figure with the surrounding white space ground.
The fifteen figures above form a unified whole (the shape of a tree) because of their proximity.
This image uses complex figure/ground relationships which change upon perceiving leaves, water and tree trunk.
In this image, the figure and ground relationships change as the eye perceives the the form of a shade or the silhouette of a face.
Gautam Gaikwad | Graphic Design |M. Des | 67
68 |National Institute of Design
5
Design Concept & Explorations Thinking on Paper Design Direction 1 Design Direction 2 Design Direction 3 Design Approach User Feedback
Gautam Gaikwad | Graphic Design |M. Des | 69
“It is important to use your hands, that is what distinguishes you from a cow or a computer operator.� ~ Paul Rand ~
70 |National Institute of Design
Thinking on Paper While working with keyword from the brand and Philosophy A lot of people can ideate directly on the computer,as it allows you to play around with the elements, Personally I chose to think on paper, and then took the idea forward with whichever tool or medium I found appropriate. Visualizing on paper not only gives you the perfect outlet for your ideas, but it is also a spontaneous way of quickly seeing how the idea materializes out of your head. According to research and brainstorming, it was important to the designs and I felt the pressure of conveying the message clearly and effectively. My mind was buzzing with various thoughts and I decided to start with what’s available – the keywords from the Brand philosophy. And I started to visualize worlds in to abstract ideas/ forms. Brainstorming - 2/3 “Visualizing on paper not only gives the perfect outlet to your ideas. It is also a spontaneous way of quickly seeing how the idea materializes out of your head.” Gautam Gaikwad | Graphic Design |M. Des | 71
Exploring an Approach Design Direction 1 I wanted to understand and reason with the elements, make meaning, and uncover the story behind things that didn’t reveal anything at first glance. After exploration with logotype FIND. I was trying explorations with the initial alphabet ‘F’ with basic shapes. Elements like bar graph and direction arrow which indicate growth.
72 |National Institute of Design
After scribbling a few options, we narrow down two options which looked good and they were close to the philosophy, After that I tried to de-clulter the shape. What remained is an direction arrow, and also shows F, the initial letter of FIND. I tried to refine it in illustrator. Tring to maintain its geometric shape. I then filled that shape with black color to check its visual weight.
Gautam Gaikwad | Graphic Design |M. Des | 73
I tried out a logo architecture. Elements are equidistant distance and centered. and the space is equally divided in the square.
74 |National Institute of Design
In the initial scribbles, there was another option we selected to a further refine which was also visually appealing and a reflects statistics, ups and downs in the form of bar graph.
Gautam Gaikwad | Graphic Design |M. Des | 75
After this initial round of visualizing, my thoughts and concepts, I tried to refine the option. Keeping with in mind that space should be a equally divided with its spacing around logo.
76 |National Institute of Design
Exploring An Approach Design Direction 2 These are a few explorations that I have worked on using ‘Search’ keyword. In the initial brainstorming, Search keyword used as exploring new thing. and for that I use the visual representation of Magnifying glass which basically represents early stage for finding out information.
Gautam Gaikwad | Graphic Design |M. Des | 77
I tried to refine handdrawn logo and tried to balance the shapes. I was trying to keep it clean and simple. Tried to avoid complicated object or object interactions.
78 |National Institute of Design
While exploring globe element I tried to balance negative and positive space. The option is visually looking more balanced.
Gautam Gaikwad | Graphic Design |M. Des | 79
This is one of the options which was visually appealing and close to the brand philosophy. In the center of the magnifying glass, there is a globe, which represents ‘Discovering the world’.
80 |National Institute of Design
Layout and Position Exploration
FIND Humnst777 BlkCn BT Black
Gautam Gaikwad | Graphic Design |M. Des | 81
This is one of the options which was done while the short presentation of logo done earlier. it is the same concept using typeface.
82 |National Institute of Design
Exploring An Approach Design Direction 3 This is the improvisation of concept that was done earlier. As per the discussion I thought, it is important to add ‘Data’ as it is also an important visual element that should be added to a logo. Its visual representation I was depicted with a line the where it gets connect I highlighted with dots. Which is actually what the company does. It shows the News, Data which is going to impact the share market.
Gautam Gaikwad | Graphic Design |M. Des | 83
84 |National Institute of Design
Design Approach After this initial round of visualizing my thoughts and concepts, I tried to analyze which ideas could be taken forward. My approach was considering keywords, and I tried to reflect that in to logo using visuals in it. I tried to take inputs from Mr. Som Sagar who is the co-founder of company. I explained him to the logo and its limitations. We had a small presentation on it. I tried to find out possibilities in logos. I explained that the logo is going to minimize in size and I tried combine his inputs, my ideas and the requirement together.
Gautam Gaikwad | Graphic Design |M. Des | 85
FIND A
B
C
F
G
H
86 |National Institute of Design
FIND D
User Feedback After showing an option to the user. we asked them to give it a ranking. and select the best three. Options B, D, and option H were selected by most of the users. Option H was simple three horizontal bars and was visually appealing and it shows initial word from FIND. Option D was quite good from the users perspective. The globe inside the magnifying glass. Most of the users said this would make it look like it is a news based company or search engine. Finally, option B which was selected by a numbers of a user is different than any option. It was little difficult for them to elect it to the company but in the opinion, it connecting the dot or highlighting something. Its spacing and balance were highly appreciated. After Discussing user feedback with the team, we decided to improve option B.
Gautam Gaikwad | Graphic Design |M. Des | 87
88 |National Institute of Design
6
Execution of Selected Concepts Final Logo Elements and Principles of Design Logo Architecture Logo Grid Colour Options Logo in Single Colour and Reverse Identity Style Guides Typeface Minimum Size Corporate Identity Final Deliverable Gautam Gaikwad | Graphic Design |M. Des | 89
90 |National Institute of Design
Final Logo
From the multiple options that I came up with, I decided to take forward and further explored four concepts which appealed to me and were most suitable to the design brief.
FIND
Gautam Gaikwad | Graphic Design |M. Des | 91
Elements and Principles of Design Balance is the equal distribution of visual weight in a design. Visual balance occurs around a vertical axis; our eyes require the visual weight to be equal on the two sides of the axis. We are bilateral creatures and our sense of balance is innate. When elements are not balanced around a vertical axis, the effect is disturbing and makes us uncomfortable.
Factor
Effect
Size
Larger objects appear visually heavier than smaller objects
Shape
Objects of regular shape appear heavier than irregularly shaped ones
Visual Weight
The perceived direction of the visual forces. It’s the direction we think an element should be moving if it was given a chance to move based on the forces acting on it.
92 |National Institute of Design
Form & Space
Positive forms weigh more than negative space. A large space can be balanced against a smaller positive form
Isolation
Positive forms weigh more than negative space. A large space can be balanced against a smaller positive form
Effect
Density
Packing more elements into a given space gives more weight to that space. Multiple small objects can balance one larger object.
Color
High-Intensity colors appear heavier than low-intensity ones. A small area of bright color can counterbalance a larger area of dull neutral color
Value
A darker object will have more weight than a lighter object. The higher the value-contrast (between object and background), the heavier the weight of the object*
Objects of compact shape are visually heavier than those not compact
The perceived weight of a visual element. It’s a measure of how much anything on the page attracts the eye of your viewer.
Visual Direction
Factor
The idea is that every canvas has a structural network of forces running through it. Even if no elements are inside the canvas, our eye will be drawn to certain parts of the canvas because of this network of forces seen in the image below.
Optical Center
Objects and elements balance around a point. In the image of the blocks it’s the fulcrum of the lever. On a page, it’s the optical center. The optical center is a point that attracts the viewer’s eye unless other visual elements pull the eye elsewhere. By default a reader’s eye will naturally start in the upper left and proceed toward the lower right, passing through the optical center. Naturally, in a country that reads from right to left you would reverse things a bit.
Rudolf Arnheim’s structural net
Every shape has a geometric center. Draw 2 lines from corner to corner on a rectangle and the point where the lines meet is the geometric center. The optical center is slightly above the geometric center. When designing you should balance your elements around the optical center and not the geometric center.
Gautam Gaikwad | Graphic Design |M. Des | 93
Logo Architecture
94 |National Institute of Design
Logo Grid
Gautam Gaikwad | Graphic Design |M. Des | 95
Colour Options In the beginning of the project, it was decided that logo will be in single color. Find logo will mostly be going to appear on the black bacground. Because of the Find Application, and the terminal is in black. Heckyl logo is in purple, keep that in mind there should be a contrast between Find logo and black background and Heckyl logo. I was looking for colour options which would be go with contrast and will be appropriate with the brand philosophy.
96 |National Institute of Design
Finally, after using different color combinations and layout, I decided that this layout and color is going to work well.
Gautam Gaikwad | Graphic Design |M. Des | 97
Colour Selection
98 |National Institute of Design
Logo in Single Colour and Reverse
Gautam Gaikwad | Graphic Design |M. Des | 99
Identity Style Guides Free space around logo
100 |National Institute of Design
Typeface
Primary Typeface - Open Sans
Open Sans - Light 1234567890 abcdefghijklmnopqrstuvwxyz ABCDEFGHIJKLMNOPQRSTUVWXYZ Open Sans - Regular 1234567890 abcdefghijklmnopqrstuvwxyz ABCDEFGHIJKLMNOPQRSTUVWXYZ
Gautam Gaikwad | Graphic Design |M. Des | 101
Minimum Size Reduction in size after a certain level causes legibility problems. To avoid any such visibility issues minimum sizes for the usage of brand mark were decided. The brandmark’s smaller side is not supposed to be used in sizes smaller than a) 15 mm for print media b) 30 px for digital purposes
102 |National Institute of Design
Corporate Identity
Visiting Card
Actual Size: W 92 mm x H 54mm
Gautam Gaikwad | Graphic Design |M. Des | 103
Envelope
Actual Size: W 243 mm x H 108mm
104 |National Institute of Design
Letterhead
Actual Size: W 210 mm x H 297mm
Gautam Gaikwad | Graphic Design |M. Des | 105
106 |National Institute of Design
Gautam Gaikwad | Graphic Design |M. Des | 107
108 |National Institute of Design
7
Conclusion Conclusion Future Directions
Gautam Gaikwad | Graphic Design |M. Des | 109
110 |National Institute of Design
Conclusion Journey Starting from the project topic selection to making the final identity for ‘FIND’, I thoroughly enjoyed it at every single stage and learned different things. I learned, how to handle a real time branding project. Most importantly that how Logo, Identity and Brand are different in nature and how they work for a company. And how it helps to represent different aspects of a brand with just one logo by using different forms, colours or shapes. Altogether, it was a very different project which I never attempted before in academics.
Future Directions The Branding project ends here. I could have explored usage of logo on various medium like the website, Mobile application and should have tested its actual dimension but since the website and mobile applications were incomplete by then, I couldn’t implement the logo.
Gautam Gaikwad | Graphic Design |M. Des | 111
112 |National Institute of Design
Responsive Website Design for FIND
Gautam Gaikwad | Graphic Design |M. Des | 113
Phase 1
Phase 4
Phase 5
Introduction
Initial Research
Design Development
Phase 2
Understanding the Context
Competitor Study
126
Phase 3
Overall Insights
129
Study of Graphical User Interface
User Interface
118
Evolution of GUI
120
The Elements Of User Experience
123
114 |National Institute of Design
Understanding the Target Group
132
User Study
133
Analysis
134
Key Findings
135
Synthesis
137
Phase 6
Phase 7
Phase 8
Design Concept Explorations
Back to Square One
Conclusion
Concept Visualization
140
Best Marketing Strategies
152
Conclusion
173
Layout Exploration
141
Positioning Strategy
155
Future Direction
User Flow -1
143
Brainstorming
156
Bibliography
Visual Design
146
Innovations that Changed the World
157
Video References
-
Responsive Website Grid
147
Important Sectors in the Stock Market 158
Webliography
-
Typography
148
Innovations and Discoveries in Sector
159
Image References
-
Feedback
151
Initial landing pages for website
160
Colophon
-
User Flow-2
162
Finalized Images for Landing Pages
163
About Heckyl Find Page
165
Website on Mobile Phone
166
175
Gautam Gaikwad | Graphic Design |M. Des | 115
116 |National Institute of Design
3
Study of GUI User Interface Evolution of GUI The Elements Of User Experience
Gautam Gaikwad | Graphic Design |M. Des | 117
User Interface In information technology, the user interface (UI) is everything designed into an information device with which a human being may interact -including display screen, keyboard, mouse, light pen, the appearance of a desktop, illuminated characters, help messages, and how an application program or a Web site invites interaction and responds to it. In early computers, there was very little user interface except for a few buttons at an operator’s console. The user interface was largely in the form of punched card input and report output. Later, a user was provided the ability to interact with a computer online and the user interface was a nearly blank display screen with a command line, a keyboard, and a set of commands and computer responses that were exchanged. This command line interface led to one in which menus (list of choices written in text) predominated. And, finally, the graphical user interface (GUI) arrived, originating mainly in Xerox’s Palo Alto Research Center, adopted and enhanced by Apple Computer, and finally effectively standardized by Microsoft in its Windows operating systems. 118 |National Institute of Design
The user interface can arguably include the total “user experience,” which may include the aesthetic appearance of the device, response time, and the content that is presented to the user within the context of the user interface.www Essentially, user interface is not just about the way the buttons are placed or how it looks on a computer screen. It is about the way it functions. The purpose is to make the application work in a way that it is enjoyed by the users. The user interface can arguably include the total “user experience,” which may include the aesthetic appearance of the device, response time, and the content that is presented to the user within the context of the user interface.
10 Usability Heuristics for User Interface Design Visibility of system status The system should always keep users informed about what is going on, through appropriate feedback within reasonable time. Match between system and the real world The system should speak the users’ language, with words, phrases and concepts familiar to the
user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order. User control and freedom Users often choose system functions by mistake and will need a clearly marked “emergency exit” to leave the unwanted state without having to go through an extended dialogue. Support undo and redo. Consistency and standards Users should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions. Error prevention Even better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action. Recognition rather than recall Minimize the user’s memory load by making objects, actions, and options visible. The user should not have to remember information
from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.
information should be easy to search, focused on the user’s task, list concrete steps to be carried out, and not be too large.
Flexibility and efficiency of use Accelerators -- unseen by the novice user -- may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.
Graphical User Interface
Aesthetic and minimalist design Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility. Help users recognize, diagnose, and recover from errors Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution. Help and documentation Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such
A graphical user interface or GUI is a type of interface that allows users to interact with electronic devices through graphical icons and visual indicators such as secondary notation, as opposed to text-based interfaces, typed command labels or text navigation Today nearly all digital interfaces are GUIs. The first commercially available GUI, called “PARC,” was developed by Xerox. It was used by the Xerox 8010 Information System, which was released in 1981. For several decades thereafter, GUIs were controlled exclusively by a mouse and a keyboard. While these types of input devices are sufficient for desktop computers, they do not work as well for mobile devices, such as smartphones and tablets. Therefore, mobile operating systems are designed to use a touchscreen interface. Many mobile devices can now be controlled by spoken commands as well. Gautam Gaikwad | Graphic Design |M. Des | 119
Evolution of GUI (Graphic User Interface )
1981 Xerox Star 1983 Apple Lisa
1968 Englebarts NLS Demo
1970
1973 Xerox Alto
Visicorp VisiOn
1974 Xerox Alto with Smalltalk
1984 Apple Macintosh
1980 1985 Atari ST-Commodore Amiga Mircrosoft Windows 1.0
1987 Microsoft windows 2.0 X Window System release 10
1990 Microsoft Windows 3.0
120 |National Institute of Design
1992 IBM OS/2 2.0
2011 Mac Os X lion
1995 Microsoft windows 95 Be, Inc. BeOs
1990
2001 Apple Macintosh OSX 10.0
2012 Windows 8
Microsoft windows XP
2015 Mac Os X El Caption
2000 1998 KDE and Gnome
2010 2007 Mac Os X leapord
windows Vista
2009 Windows 7
Gautam Gaikwad | Graphic Design |M. Des | 121
122 |National Institute of Design
The Elements Of User Experience The user experience development process is all about ensuring that no aspect of the user’s experience with your site happens without your conscious, explicit intent. This means taking into account every possibility of every action the user is likely to take and understanding the user’s expectations at every step of the way through that process. It sounds like a big job, and in some ways it is. But by breaking the job of crafting user experience down into its component elements, we can better understand the problem as a whole.
The Five Planes Most people, at one time or another, have purchased a book over the Web. The experience is pretty much the same every time you go to the site, you find the book you want (maybe by using a search engine or maybe by browsing a catalog), you give the site your credit card number and your address, and the site confirms that the book will be shipped to you. That neat, tidy experience actually results from a whole set of decisions some small, some large about how the site looks, how it behaves, and what it allows you to do. These decisions build
upon each other, informing and influencing all aspects of the user experience. If we peel away the layers of that experience, we can begin to understand how those decisions are made. The Surface Plane On the surface you see a series of Web pages, made up of images and text. Some of these images are things you can click on, performing some sort of function such as taking you to a shopping cart. Some of these images are just illustrations, such as a photograph of a book cover or the logo of the site itself. The Skeleton Plane Beneath that surface is the skeleton of the site : the placement of buttons, tabs, photos, and blocks of text. The skeleton is designed to optimize the arrangement of these elements for maximum effect and efficiency - so that you remember the logo and can find that shopping cart button when you need it. The Structure Plane The skeleton is a concrete expression of the more abstract structure of the site. The skeleton might define the placement of the interface elements on our checkout page; the structure would
define how users got to that page and where they could go when they were finished there. The skeleton might define the arrangement of navigational items allowing the users to browse categories of books; the structure would define what those categories actually were. The Scope Plane The structure defines the way in which the various features and functions of the site fit together. Just what those features and functions are constitutes the scope of the site. Some sites that sell books offer a feature that enables users to save previously used addresses so they can be used again. The question of whether that feature or any feature is included on a site is a question of scope. The Strategy Plane The scope is fundamentally determined by the strategy of the site. This strategy incorporates not only what the people running the site want to get out of it but what the users want to get out of the site as well. In the case of our bookstore example, some of the strategic objectives are pretty obvious: Users want to buy books, and we want to sell them. Other objectives might not be so easy to articulate. Gautam Gaikwad | Graphic Design |M. Des | 123
124 |National Institute of Design
4
Initial Research Competitor Study Overall Insights
Gautam Gaikwad | Graphic Design |M. Des | 125
Competitor Study Thomson Reuters Eikon
Thomson Reuters Eikon provides easy access to trusted news, data, and analytics, all filtered by relevance to your exact needs, and displayed in a highly visual way that’s easy to grasp and act on. From the same intuitive desktop or mobile device, you can instantly connect to new and emerging markets, deep and varied pools of liquidity, professional networks and expert support – anywhere, anytime. The result? Comprehensive financial analysis, through which you’ll discover more opportunities and make crucial decisions with confidence.
Color Palette
Typography Typeface - Arial Headline Text - Arial Body text - Arial
126 |National Institute of Design
DueDil
DueDil was founded in 2011 to provide companies with better information about other businesses. It is now one of the largest sources of company information in Europe. The company’s objective is to build a worldwide database of all companies, bringing full transparency to the way global business is conducted. DueDil aims to make the world’s private company information available and easy to understand for everyone.
Color Palette
Typography Typeface - Open Sans Body text - Open Sans
Based in London, DueDil has raised nearly $30m from respected investors in the US and UK, including Oak Investment Partners, Passion Capital and Notion Capital.
Gautam Gaikwad | Graphic Design |M. Des | 127
128 |National Institute of Design
Overall Insights Thomson Reuters product website shows product photograph and designed with simple layout, clearly highlighted important features. the color pallet is black and orange, which is used in the main logo. Different requirements shown, with minimum text. Duedil.com also has the same features like Thomson Reuters. Duedil has Request demo and demo video option show clearly on the landing page. keeping in mind, different needs of different users they have options linked for Sales, Marketing, Research, Procurement, Compliance, Credit and Risk. The basic color scheme is turquoise blue. landing page of Duedils is also show Duedil product. It also has a very clean layout. In both the websites, the most important thing is that the flow is simple to understand. If a user goes through any flow, in the end, he will able to see a free trial or demo version of the product.
Gautam Gaikwad | Graphic Design |M. Des | 129
130 |National Institute of Design
5
Design Approach Understanding the Target Group User Study Analysis Key Findings Synthesis
Gautam Gaikwad | Graphic Design |M. Des | 131
Understanding the Target Group The target group for this project is that the buyers purchase these projects for various reasons. Including Brokers, Analysts and Traders The priority in which they want the information related to structured data. They could have various preferences related to Data structure, news related market moving articles, breaking alerts and market moving notifications in real-time. This target group faces the issue regarding real-time data and news, to take a decision regarding buying or selling stocks. That problem mostly going to be solved by FIND- the most trusted platform.
132 |National Institute of Design
User Study
Purvesh Mehta - Broker, Age- 37 Most of the websites has readability issues, the font size is small so most of the time I am not able to read on a mobile phone. Sometimes, I also get confused with the link that opens after clicking on an option. I mostly go through website while traveling. Device used : Smart-phone, Desktop.
Amit Jain - Analyst, Age - 27
Dhruv Keshan - Trader, Age - 35
Most of the time I close the website if it doesn’t have good design and if it’s confusing.
Information structure is most important. Most of the time it is difficult to reach to the source of the information.
Scrolling pages would be a better option to go through websites. I have gone through so many websites which have a scroll are much easier to get information on a mobile phone as well as on the desktop. Whenever I get time or get an important link, I go through it.
Device used: iphone, ipad, Desktop
Colors are good most of the time and readability is also fine. Important text should not be very small. It is very difficult to zoom in there every time, to read the content. Device used: Smart-phone, Desktop
Gautam Gaikwad | Graphic Design |M. Des | 133
Analysis A responsive design can improve user experience and accommodate everyone, whether they are on a desktop or a smartphone or tablet. In providing the best possible experience, Users will have a positive opinion on the website, meaning they will most probably return. User flow Typography Desktop Mood
Responsive design Readability
Smart-phone
Tablet
There is no doubt about it – typography and the font-faces we choose have huge impact on multiple aspects of a website including readability, mood, perceived article length, user experience and much, much more. It is absolutely essential that designers know and understand the different principles of typography that create a pleasing design, in order to properly portray the vision and mood of the website. A major factor affecting conversions is user flow. It’s the path a user follows through website interface to complete a task (make a reservation, purchase a product, subscribe to something). It’s also called user journey. In order to maximize conversions, I have to get the user flow right – build one that matches user’s needs.
134 |National Institute of Design
Key Findings Finding information, Knowledge on the website it’s an easy task. But most of the time it is difficult to get information which is important. But keeping the user involved in the whole process is important. the whole flow of information should be easy. People always get attracted to new things which attract them which make them curious, this is human behavior. And one can easily give up on an interaction if it is slow and confusing. Design should be aesthetically pleasant where users should not get confused or ignore the site.
Gautam Gaikwad | Graphic Design |M. Des | 135
136 |National Institute of Design
Synthesis Content Requirement: Need of the user: After speaking with the target group, Various of the users were identified. After seeing the product site, user should get more curious to go to the product subscription. The main thing needed making this decision are trust and vision. Site Objective : The main objective of the website is to present the project and provide specific information about in a manner that it genarates interst among the target group while staying true and trustworthy. Another objective is also to help the end user make a faster decision to get subscription. The content that is required on the project details page should be determined taking in to consideration both these factors. The needs of the users and the objectives of the website.
Gautam Gaikwad | Graphic Design |M. Des | 137
138 |National Institute of Design
6
Design Development Concept Visualization Layout Exploration User Flow -1 Visual Design Responsive Website Grid Typography Feedback
Gautam Gaikwad | Graphic Design |M. Des | 139
Concept Visualization The first exploration was a single page layout. The landing page contains an impressive image of the Product. And the website flow will be like story telling. The second page will contain USP’S of the product. The third page will contain options for different users. And in next the page, Next option for subscription and free trial. Then the brand promotion page and product video.
Few roughly drawn scribbles of web flows.
140 |National Institute of Design
Layout Exploration I tried a few options with more visual aid in it to present the idea, to get a better idea about the website, Since the branding and website project was moving along side, the logo color, and color scheme weren’t finalized so I used few work in progress logo and color schemes which I was approached.
Gautam Gaikwad | Graphic Design |M. Des | 141
142 |National Institute of Design
User Flow -1 Home
What
Product Video Usp’s of product
Why
How
Solutions of product
Technology
Demo Request
Demo Request
Blog
Blog page info
Contact
User Information
Subscription
Gautam Gaikwad | Graphic Design |M. Des | 143
After having discussed on the a first layout, We decided to change the flow a little bit with Why, What, How approach.
144 |National Institute of Design
After working on the first concept, it has been decided to work on the new concept. I tried to refine the concept with the layouts.
Gautam Gaikwad | Graphic Design |M. Des | 145
Visual Design Understanding Web Grids
Responsive web design (RWD) is an approach to web design aimed at allowing desktop webpages to be viewed in response to the size of the device one is viewing with. A site designed with RWD adapts the layout to the viewing environment by using fluid, proportion-based grids, flexible images, and CSS3 media queries, an extension of the @media rule, in the following ways: 1. The fluid grid concept calls for page element sizing to be in relative units like percentages, rather than absolute units like pixels or points. Flexible images are also sized in relative units, so as to prevent them from displaying outside their containing element. 2. Media queries allow the page to use different CSS style rules based on characteristics of the device the site is being displayed on, most commonly the width of the browser. Responsive web design has become more important as the amount of mobile traffic now accounts for more than half of total Internet traffic.
https://upload.wikimedia.org/wikipedia/commons/8/81/Content-is-like-water-1980.jpg
146 |National Institute of Design
3. Therefore, Google announced Mobilegeddon (April 21, 2015) and started to boost the ratings of sites that are mobile friendly if the search was made from a mobile device.
Responsive Website Grid Fluid Grid Layout Tutorial For Responsive Web Design Creation Responsive design is the process of arranging the layout in a way that all the important information is presented in a user readable way in any kind of device or screen size. Most designers will choose a fluid grid layout since it is easier to handle grid based layouts in different kind of devices.
Gautam Gaikwad | Graphic Design |M. Des | 147
Typography The typeface used for this project is Open Sans. Open Sans is a sans-serif typeface designed by Steve Matteson and commissioned by Google. According to Google, it was developed with an “upright stress, open forms and a neutral, yet friendly appearance” and is “optimized for legibility across print, web, and mobile interfaces.” Featuring wide apertures on many letters and a large x-height (tall lower-case letters), the typeface is highly legible on screen and at small sizes. It belongs to the humanist genre of sans-serif typefaces, with a true italic. Open Sans is available in a large number of variants. There are five weights (300 Light, 400 Normal, Semi-Bold 600, Bold 700 and Extra Bold 800), each of them with an italic version, totaling ten variants. There is also a separate font called Open Sans Condensed with 3 width variations.
148 |National Institute of Design
News, insights and expertise
Primary Typeface - Open Sans Open Sans - Light
Open Sans - Bold
1234567890
1234567890
abcdefghijklmnopqrstuvwxyz
abcdefghijklmnopqrstuvwxyz
ABCDEFGHIJKLMNOPQRSTUVWXYZ
ABCDEFGHIJKLMNOPQRSTUVWXYZ
Open Sans - Regular
Open Sans - Extrabold
1234567890
1234567890
abcdefghijklmnopqrstuvwxyz
abcdefghijklmnopqrstuvwxyz
ABCDEFGHIJKLMNOPQRSTUVWXYZ
ABCDEFGHIJKLMNOPQRSTUVWXYZ
Open Sans - Light Italic 1234567890 abcdefghijklmnopqrstuvwxyz ABCDEFGHIJKLMNOPQRSTUVWXYZ
Gautam Gaikwad | Graphic Design |M. Des | 149
150 |National Institute of Design
Feedback While discussing these two layout options, we realized that they were both not sufficient as per the requirement of the exercise, and we needed to give more importance to the landing page as a strategy which would highlight the theme of the brand philosophy of FIND.
Gautam Gaikwad | Graphic Design |M. Des | 151
152 |National Institute of Design
7
Back to Square One Best Marketing Strategies Positioning Strategy Brainstorming Innovations that Changed the World Important Sectors in the Stock Market Innovations and Discoveries in Sector Initial landing pages for website User Flow-2 Finalized Images for Landing Pages
Gautam Gaikwad | Graphic Design |M. Des | 153
Best Marketing Strategies Golden Circle essence by SimonSinek
Simon O. Sinek is an author, speaker, and consultant who writes on leadership and management. He joined the RAND Corporation in 2010 as an adjunct staff member, where he advises on matters of military innovation and planning.
What Every organization on the planet knows WHAT they do. These are products they sell or the services they offer. How Some organization know HOW they do it. These are the things that make them special or set them apart from their competition. Why Very few organization know WHY they do what they do. WHY is not about making money. That’s a result. It’s a purpose, Cause or belief. it’s very reason your organization exist.
154 |National Institute of Design
Think different Concept, philosophy, background
When Steve jobs talk about marketing strategies, he wants to do some advertising campaign. Where he talks about marketing. his thought on marketing: great brands need investments and caring if its retain its relevance and vitality. Apple marketing should not talk about speed and fees, either about bits and megahertz, and there should not the comparison with another brand like Windows.
1997. Steve Jobs in shorts, relaxed, during internal meeting with Apple executives and managers, just a few weeks after his return to Apple, speaks briefly about planned changes in company (pipeline, products, distribution changes) and then presents first information about planned “Think Different” campaign, now legendary and iconic... Samples of TV commercial, outdoor, posters, and press ads.
Steve gave an example, “ The dairy industry tried 20 years to convince people the milk is good for health. Milk was good for you. its a lie but they tried anyway. and they tried “Got milk” and sales went up. Got milk wasn’t talked about the product. It focused on the absence of the product. Later he talked about, The greatest job of marketing universe has seen is Nike. Nike sells a commodity, they sell shoes and yet, when we think of Nike we feel something different than the shoes. The company in their ad as we know, they don’t ever talk about the product, they don’t ever tell us about their air soles, and they don’t do a comparison.
SO what they do? They honor great athletics and they a honor great athletes. That they are about. And apple spends a fortune on advertising our customer wants to know, Who is apple and what is apple stands for. where we fit in this world ? What we are about, Ist making boxes for people to get done their job done. Although we do that well we do that better than almost anybody in some case Apple core values. Is that believe that people with passion can change the world for the better. that’s what apple believe. The way to communicate this - Honour those people who have changed the world. some of them are living some of them are not. But ones that aren’t - as you see you will know. “That if they ever used a computer it would have been a Mac!” It’s people honoring the people, who think different and who move this world forward. And is is what we are about, It touches the soul of company. Gautam Gaikwad | Graphic Design |M. Des | 155
Set 1 Amelia Earhart Alfred Hitchcock Pablo Picasso Mahatma Gandhi Thomas Edison Set 2 Maria Callas Martha Graham Joan Baez Ted Turner 14th Dalai Lama (never officially released due to licensing issues and the politically sensitive nature) Set 3 Jim Henson Miles Davis Ansel Adams Lucille Ball & Desi Arnaz Bob Dylan (Never officially released due to licensing issues) Set 4 Frank Sinatra Richard Feynman Jackie Robinson Cesar Chavez
156 |National Institute of Design
Set 5 (The Directors set, never officially released) Charlie Chaplin Francis Ford Coppola Orson Welles Frank Capra John Huston Educator Set Albert Einstein Amelia Earhart Miles Davis Jim Henson Jane Goodall Mahatma Gandhi John Lennon & Yoko Ono Cesar Chavez James Watson Pablo Picasso
Positioning Strategy
NIKE
They honor great athletics and they honor great athletes.
Apple
Honour those people who have changed the world. Some of them are living some of them are not. But ones that aren’t - as you see you will know. “That if they ever used a computer it would have been a Mac!”
Gautam Gaikwad | Graphic Design |M. Des | 157
Brainstorming
158 |National Institute of Design
Innovations that Changed the World Around 1440 - Johannes Gutenberg Printing Press
1876 - Telephone was invented in by Alexander Graham Bell
1769 - Automobile
1903 - Wright brothers- aeroplane
1928 - Alexander Flemming, who is credited with discovering penicillin
1864 - Louis Pasteur - Pasteurization
Thomas Edison is credited with creating the light bulb
1765 - JAMES WATT, Steam Engine
Gautam Gaikwad | Graphic Design |M. Des | 159
Important Sectors in the Stock Market
Aviation
Telecom
Pharma
Energy
Oil and gas
IOT-Internate of things
Transportation
Drilling
160 |National Institute of Design
After finding milestones in all innovation and discoveries, we finalized that it would be better to narrow down it for a few sectors which are more important to us like Aviation, Telecom, Pharma, Energy, Oil and Gas, IOT- Internet of Things Transportation and Drilling.
Innovations and Discoveries in Sector 1990 Hubble Space Telescop
Aviation
1903 Wright Brothers
Louis Pasteur
Pharma
1928 Sir Alexander Fleming
Oil and Gas
1908 Henry Ford
1876 Alexander Graham Bell
1879 Thomas Edison
Transportation
Telecom
Energy
IOT- Internet of things
Drilling
1765 James Watt
1969 Apollo 11
Gautam Gaikwad | Graphic Design |M. Des | 161
Initial landing pages for website
’
’
162 |National Institute of Design
After finalising a few images, I tried using different images for the landing page. I tried different layouts for text. I also made sure that its readability contrast with the background was maintained and at the same time, it was visually appealing.
’
Gautam Gaikwad | Graphic Design |M. Des | 163
User Flow-2
Home
Landing page Discoveries
About us
Product
Our team
Heckyl Find Terminal
Product Info
Team
Contact us
subscribe
This website is one page layout, so user flow is quite simple.
164 |National Institute of Design
Finalized Images for Landing Pages
After finalizing all images, we selected three images for landing page, which are good with resolution and with the good space in it.
Gautam Gaikwad | Graphic Design |M. Des | 165
166 |National Institute of Design
Final Landing Page
Gautam Gaikwad | Graphic Design |M. Des | 167
About Heckyl Find Page
168 |National Institute of Design
Website on Mobile Phone
Gautam Gaikwad | Graphic Design |M. Des | 169
170 |National Institute of Design
8
Conclusion Conclusion Future Direction Bibliography Video References Webliography Image References Colophon
Gautam Gaikwad | Graphic Design |M. Des | 171
172 |National Institute of Design
Conclusion My Graduation project includes branding and Website design. I have never worked on this kind of project before, I was not aware of this domain. but while working I found some connection. Which helps me a lot. This project mostly focused on strategy. As a graphic designer, it was so Important for me to understand both the sides. Design and strategy also was important for me to understand the target audience and their interest. It was a worthy experience to work on this project. This helped in understanding the various viewpoints on the stock market.
Future Direction The FIND website design project was finished on time, but the work does not end there as more information about the product. needs to be added for product carousel and form filling. I hope this will be useful and convenient for users.
Gautam Gaikwad | Graphic Design |M. Des | 173
Bibliography
Webliography
Art and Visual Perception: A Psychology of the Creative Eye Paperback – Deluxe Edition, November 8, 2004
1. issuu.com/sttlaltaf/docs/logo_design_corporate_identity___branding_workshop 2. medium.com/life-learning/brainstorm-your-marketing-strategy 3. www.paul-rand.com/foundation/identity/#prettyPhoto[logo]/41/ 4. www.youtube.com/next identity 5. www.behance.net/gallery/33648734/Adobe-XD-Design-Week-2016 6. 6. www.webdesignerdepot.com/-essential-rules-to-followwhen-designing-a-logo/ 7. itscreativejuice.com/steps-branding-process-2/ _ Question for branding 8. www.behance.net/gallery/33648734/Adobe-XD-Design-Week-2016 9. www.blog.sanasecurities.com 10. easyinv.blogspot.in/2012/07/origin-of-term-bull-market-and-bear 11. www.toptenreviews.com/ 12. www.uxness.in/2015/02/10-heuristic-principle 13. www.boyledesigngroup.com/insights 14. worksdesigngroup.com/paul-rand-logo-designer 15. www.smashingmagazine.com/2008/01/10-principles-of-effective-web-design 16. material.google.com/style/typography.html#typography-styles
Frutigar Adrian, Signs and symbols. Their design and Meaning. New York: Van Nostrand Reinhold, 1989 Print Healey Matthew, Deconstruction Logo Design. hove: Rotovision
Video References Apple Confidential - Steve Jobs on “Think Different” - Internal Meeting Sept. 23, 1997 Hugo Barra Xiaomi (Code Conference 2015) Elon Musk talks entrepreneurship (2008.5.16) Golden Circle essence by Simon Sinek Apple’s Jony Ive on the Lessons He Learned From Steve Jobs George Blankenship on having an Innovation Mindset
174 |National Institute of Design
Image References Data Analytics Print lab Image - Titu Milli www.designtoday.info/brand-new-the-history-of-branding www.logodesignlove.com/paul-rand-videox www.creativebloq.com/branding/choose-colour-logo-design-8133973 usabilitypost.com/2008/09/29/a-guide-to-choosing-colors-for-your-brand/ www.designyourway.net/blog/inspiration/the-importance-of-creating-a-brand-identity-guide/ Discovery worthofmouth.co.uk/2015/12/24/selfishness/ expedite-consulting.com/discovery-channel-discovered/ news.nationalgeographic.com/news/-space-shuttle-discovery-last-science-nasa
Colophon This Document was printed at Chaap Digital Print Studio, Ahmedabad.Using Richo C7110, On 130 gsm matt paper on 28.11.2016. Typeface used in Document : Roboto Slab Garamond Calibri
Hubble http://www.astronomy.com/~/media/91688A5E32574ECAB01F45C8167FD4B6.jpg Alexander Fleming http://www.gettyimages.co.uk/event/years-since-fleming-notices-mould-growing-in-his-laboratory-53355040#scientist-alexander-fleming-discovorer-of-penicillin-pictured-in-his-picture-id78973933 Bulb http://cdn.allwallpaper.in/wallpapers/1600x900/711/cgi-black-background-light-bulbs-minimalistic-objects-1600x900-wallpaper.jpg
Gautam Gaikwad | Graphic Design |M. Des | 175