Graphic Design Portfolio | Ankita Mantri

Page 1

PORTFOLIO


“I begin with an idea, then it becomes something else.” PABLO PICASSO


PORTFOLIO CONTENTS

5

1 HERBIVORE

Editorial Design

6

2 LAST MINUTE

3 CELEBRATING TYPOGRAPHY

iPhone App UX Design

Typographic Posters & Event Promotion

BEING GANDHI

Branding & Event Marketing

7 LOUBOUTIN

Illustration & Marketing Campaign

8

4 GILROY GARLIC FESTIVAL

UN:GUILT

Logo, Branding & Packaging

Logotype & Marketing Collateral

KING KONG

Movie Promotion



HERBIVORE EDITORIAL DESIGN

DESIGN PROBLEM: Herbivore is a concept magazine, issued monthly. I designed this magazine to share my views on being a Vegetarian and to answer the eternal question: “What do you eat?”, which most meat eaters want to know.

DESIGN PROCESS: I researched on the subject of vegetarianism and found that a lot is being done to share about the idea. A lot of restaurants, supermarkets, online portals and small businesses are catering to the vegetarian eating population. Based on my findings I chose a name that was a generic word, hence more relatable—HERBIVORE. I selected a colour palatte that had colours from nature—green, brown. Since it was a magazine, I chose to create 3 volumes (covers) and 6 spreads. I also created an iPad app version for it.

DISCIPLINES: InDesign | Illustrator | Photoshop

Herbivore | Editorial Design


BRAND GUIDELINES The masthead is a manipulated version of the Futura typeface with an embedded letter 'E' which is the logo. The earthy colours make it relateable to a natural/ healthy diet.

Herbivore | Editorial Design


BUSINESS CARD I designed the business card with a very minimal design and abundant white space.

Herbivore | Editorial Design


Herbivore | Editorial Design


MAGAZINE—SPREAD

Herbivore | Editorial Design


Herbivore | Editorial Design


LAUNCH ISSUE (Left) Layouts are all focussed on high quality images and white space to draw attention to the content. The launch issue cover has a giant morphed 'V' that acts as a canvas for the text.

MAGAZINE COVERS (Issue Month2)

MAGAZINE COVERS (Issue Month 3)

Month 2 issue is the dessert

Month 3 issue is the Avocado

issue. It is also fossued on a high

issue. The cover has information

quality image. I continued to

displayed in the centre column.

organise the content in a linear columnar layout.

Herbivore | Editorial Design


Herbivore | Editorial Design


TABLET APP SCREENS I designed the tablet app keeping the images in focus just like the magazine. I also used a call to action—'Flip' to prompt readers to move ahead. All screens follow a columnar layout with focus on images and call to actions.

Herbivore | Editorial Design


Un:Guilt | Logo, Branding, Packaging


LAST MINUTE UX

DESIGN PROBLEM: When I moved to San Francisco, less than a year ago, I had little knowledge of where to find things I needed, sometimes I never found them at all. My issue reached it’s peak when I had to courier a gift to Singapore urgently and I spent 2 hours walking around Market Street looking for a ‘Red Ribbon’. Google or Yelp failed to tell me where exactly I could find it around me. The only results I got were establishments with the names that had the word ‘ribbon’ in them—some were even cake shops. As I walked from store to store it was the most helpless and frustrating experience. I was sure there are many people like me who didn’t know where to find things because they were new to the city or because they had very limited time in hand to drive to a specific store. If only they had a way to just click a button and know where around their current location they could get what they need so that they could quickly go and pick it up. That’s how I decided to design Last Minute—an app that lets you find the closest store around you from where you can buy items of everyday needs quickly.

DESIGN PROCESS: I began with an industry competitive analysis to research about existing players. After identiyfing the gaps I moved onto user research and surveys to understand how people search for and buy things they need at the last minute. This helped me draft the ideal personas who would defintiely use an app like Last Minute. I was subsequently able to create scenarios, user stories and use cases for the primary persona and was also able to design a storyboard. Once I was convinced about how how this app will be used I moved on to creating sketches and lo-fi prototypes of the app features and functionality. With that finalised I made the sitemap, page flows and wire frames for the app. Finally on Sketch I built the hi-fi prototypes and tested it on Invision.

DISCIPLINES: Illustrator | Sketch | Craft | InVision | Photoshop

Last Minute | UX


BRAND GUIDELINES The logo for Last Minute was centered around the idea that a user is on the run and needs to find an exact location where he can quickly purchase the product he needs. For the colour palette I used orange and blue—colours people have seen on other search engines and hence familiar with it.

Last Minute | UX


CHALLENGE Last Minute is a result of a UX

I used competitive analysis and

class assignment.

surveys, created personas, built

We had to build a UX design for a mobile app for any business of our choice. Most of my ideas were centered around solving issues I faced everyday as an expat in SF— finding items of daily needs,

a storyboard, drafted a scenario, use case and user story. I made prototypes and tested them. I built wireframes, a site map and page flows. Finally, I built the hi-fi protoypes and tested them.

school supplies, ethnic food

Last Minute  is  an app to help

establishments, businesses that

me and more people find things

offer day-to-day services.

easily around them.

Last Minute | UX


Last Minute | UX


HI-FI MOCKUPS Onboarding The Hi-fidelity mock ups were designed after multiple iterations. I kept in mind important factors like ease of use, familiarity of colours, layouts, functions, buttons, flows, interactions, minimal number of steps from start to finish. These factors acted as perfect guidelines to help develop the app design.

Last Minute | UX


HI-FI MOCKUPS Home/ Search 1. The app idetifies the users current location automatically. 2. User inputs the item they are looking for in the search field. 3. User types a product in the field and the app drops down suggestions for different types of items available around the users current location. 4. User can also cancel the contents of the fields by deleting text or simply clicking ‘x’ sign. 5. Hit ‘Search’ on the header OR hit ‘Return/ Search’ key on the keypad to move onto the Search Results screen.

Un:Guilt | Logo, Branding, Packaging


HI-FI MOCKUPS Search Results Search Results offers 3 tabs to choose from—Map, List, Live Views. 1. In the Map and Live View the default pin (open call-out) is the nearest location. Only one pin is open at a time. User can tap on any pin and that becomes the open pin; Previously opened pin(s) will disappear. User can tap on the ‘call-out’ to proceed to the ‘Result Details’. 2. User can also tap on the ‘Route’ icon to directly map to that location without going to the details page. 3. In the List View one can see multiple results listed with a short summary for each store. Each listing can be tapped on, to move onto a details page. In the Live View the user can move the map to virtually see around their current location stores that stock the product they need. Tap on the call-out to know more details.

Last Minute | UX


HI-FI MOCKUPS Result Details The Results Details screen shares store details. 1. Name, Address, Store Timings, Distance. 2. User can tap on the ‘Route’ button or the ‘Map’ to be directed to the Maps App (Google/ Apple) preferably with directions shown. 3. User can tap on the ‘Call’ button to make a call. 4. User can ‘Share’ the result with friends or even ‘Save’ the result as history. 5. OPEN or CLOSE is highlighted in the result to show whether the store is currently OPEN or CLOSED.

Un:Guilt | Logo, Branding, Packaging


Last Minute | UX


Louboutin | Illustration and Marketing Campaign


CELEBRATING TYPOGRAPHY TYPOGRAPHIC POSTERS EXHIBIT PROMOTIONAL MATERIAL

DESIGN PROBLEM: Celebrating Typography is a concept event held annually to celebrate typographic innovation & excellence. The 2017 Showcase is focussed on Typographic Posters created by modern artists using only type and designs & layouts inspired from the works of typographic legends— John Baskerville, Heinrich Jost & Adrian Frutiger. For the event showcase I created posters and promotional material to invite and engage design enthusiasts.

DESIGN PROCESS: The event is celerating typography and it’s history. I researched on the various typographic gurus, I studied their design principles, noted the layouts they adopted, patterns and elements that they used in their time and then translated that into my posters and other layouts. Since the 'type' was the focus I kept the design limited to black & white and added a touch of red to highlight important elements. To promote the event I designed an invite, banner, booklet and postcards.

DISCIPLINES: InDesign | Photoshop | Illustrator

Celebrating Typography | Typographic Posters & Exhibit Promotional Material


EVENT INVITE I designed the event invite using type heirarchy and column grids to hightlight information.

POSTERS AND EXHIBIT (Right) The posters were a compilation of type classficiation for 3 typefaces—Baskerville, Bauer Bodoni, Avenir, created by typographic legends— John Baskerville, Heinrich Jost & Adrian Frutiger. I used layouts and elements inspired from the artists own works & manuscripts.

Celebrating Typography | Typographic Posters & Exhibit Promotional Material


Celebrating Typography | Typographic Posters & Exhibit Promotional Material


LAMP POST BANNER For the lamp post banner I used magnified letters to draw attention and used a red and white contrast. I wanted a minimal design to bring focus to the information.

Celebrating Typography | Typographic Posters & Exhibit Promotional Material


POST CARDS Postcards were designed as an appreciation giveaway to the visitors of the exhibit. They have been designed as a snippet from the type classification posters that are being exhibited at the event.

Celebrating Typography | Typographic Posters & Exhibit Promotional Material


Celebrating Typography | Typographic Posters & Exhibit Promotional Material


EXHIBIT BOOK The promotional book will be distributed for free to visitors at the exhibit. It has published information about the celebrating typographers and their works. The book is designed with a minimal layout using a 2 column grid.

Celebrating Typography | Typographic Posters & Exhibit Promotional Material



GILROY GARLIC FESTIVAL LOGOTYPE MARKETING COLLATERAL

DESIGN PROBLEM: The Gilroy Garlic Festival is a summer food fair founded back in 1979 and has always been hosted by community volunteers. The event is targeted to families, youngsters and senior citizens. Their branding could be made more fun to suit the target audience. Hence, I chose to re-designed their logotype and create marketing collaterals to promote the event.

DESIGN PROCESS: In order to keep the branding relateable to the existing designs, I chose to use a colour palette that was inspired from the original colour palette. I also continued to use a ‘garlic’ in the logo. I manipulated the typeface used in the event name trying to keep it similar to the original logotype. Using the above guidelines my aim was to create a fun-filled design that was celebratory and promoted a fair like environment. To promote the event I designed a bus stop poster, facebook event page, brochure with a map and event details. I also created event stationery—staff and vendor ID cards.

DISCIPLINES: Illustrator | Photoshop

Gilroy Garlic Festival | Logotype & Marketing Collateral


BRAND GUIDELINES Since the existing logo has a garlic I wanted to continue using a garlic in the logotype. I tried playing with the actual colours of a garlic but found it non-playful. I finally created a logotype by manipulating the Futura typeface. I made the letters resemble like garlic tails. It has a red and yellow fiery base to resemble the hot garlic-y food.

Gilroy Garlic Festival | Logotype & Marketing Collateral


EVENT POSTER The poster is an illustration of the festival, with a giant size chef offering garlic, food stalls, performance stages, etc. The intent was to make it look like the real event.

POSTER ILLUSTRATION The poster is part of a tri-fold brochure. It opens up into an 11x17 poster. Bright colours make the poster noticeable.

Gilroy Garlic Festival | Logotype & Marketing Collateral


BROCHURE BACK & FRONT The front of the brochure is a mini version of the full-size poster. This opens up to the details of the event and further into the big poster. The back of the poster has a map of the event with an icon based key. The icons in the key are distinct in shape and colour for easy identifiication and to resemble the poster.

BROCHURE INSIDE (Right) The inside of the brochure is clean and minimal with a graphic element to keep it quirky.

Gilroy Garlic Festival | Logotype & Marketing Collateral


Gilroy Garlic Festival | Logotype & Marketing Collateral


VENDOR & STAFF BADGES Badges have icons matching to the category of the vendor's stall. For the staff the colours have been reversed (green top and blue below) for easy identification.

Gilroy Garlic Festival | Logotype & Marketing Collateral


FACEBOOK COVER PHOTO The web banner is a stripped down version of the poster. The focus is on the event name and dates, time and venue.

Gilroy Garlic Festival | Logotype & Marketing Collateral


Un:Guilt | Logo, Branding, Packaging


UN:GUILT LOGO BRANDING PACKAGING

CLIENT: Un:Guilt - Health Food Brand, India.

DESIGN PROBLEM: Un:Guilt is a vegan health food brand from India. They wanted a logo, brand identity and box packaging for their nutty bars. The brand provides innovative food solutions to make meals guilt-free yet flavourful. They are trying to enter a market with an audience that needs to be convinced to make a shift to a healthy lifestyle. They want the audience to understand that they do not have to compromise on taste by making a healthy food choice because Un:Guilt will offer their favourite food absolutely free of guilt—without sugar, milk or gluten.

DESIGN PROCESS: Eating habits develop over the course of time, so replacing them with healthy ones will require an impactful reason. Keeping this information in mind and the aim of what the brand wants to achieve I decided that it was important to create a brand identity that was attention seeking hence something vibrant, playful and lively. Something with bright colours—yellow, green and red, and maybe even use patterns.

IMPACT: The branding had a net positive impact to the business, one KPI being— orders scaled from 3 a month to 20 in the first 3 months.

DISCIPLINES: Illustrator | Photoshop

Un:Guilt | Logo, Branding & Packaging


BRAND GUIDELINES The logo is a lemon, shaped like a heart, symbolising a fresh and healthy heart. I gave it a geometric shape to break away from the norm of expecting the heart to be soft and to gauge the viewers attention. I introduced patterns to create a sense of fun and playfulness. The colours are symbolic of healthy and fresh vegetables.

Un:Guilt | Logo, Branding & Packaging


BUSINESS STATIONERY I wanted to add an element of playfulness to the business stationery by using a yellow line and pattern inside the envelope—not too much but subtly. The business card was made square to resemble the packaging box.

Un:Guilt | Logo, Branding & Packaging


PACKAGING I used pattern and vibrant colours to highlight the packaging. The boxes were made in square shapes to match the geometric shape of the logo. Along with the box I also created stickers to go on the bars.

Un:Guilt | Logo, Branding & Packaging


PRICE BOOKLET The cover has a pattern and a predominant yellow border to make it look bright. The inside of the booklet is neatly arranged in a 2 colum layout with focus on images of the products and pricing.

Un:Guilt | Logo, Branding & Packaging


Un:Guilt | Logo, Branding & Packaging


WEBSITE I designed the webpage with a minimal modular layout. The homepage is sectioned to share the brands story and showcase products. Yellow highlights and hi-fidelity photos have been used to draw the visitors focus to the contents. On the 'shop' page products have been displayed in a clean columnar layout. Hovering over any product allows for buyers to easily add items into their cart.

Un:Guilt | Logo, Branding & Packaging



BEING GANDHI BRANDING EVENT MARKETING COLLATERAL

DESIGN PROBLEM: Being Gandhi is a concept not-for-profit food bank for the homeless in San Francisco. Based on a famous historical personality I had to develop a business idea centered around their principles, ideologies or inventions. Subsequently, I had to create a brand identity, an event as well as marketing collaterals to promote the event.

DESIGN PROCESS: I chose Mahatma Gandhi as my subject because I admire his efforts towards social upliftment and his non-violent approach to free India from the British rule. In order to develop a business or event around his principles I studied his life, contributions to the society, his handwriting, typefaces that were used during that period, text layouts that were popular and conducted a detailed formstorming and facts research process. I then listed 5 principles that defined Gandhi—care, determined, help, respect, need. Based on these principles I was able to define a business name and idea, a not-for-profit institution that would provide food for the homeless in SF. I named it Being Gandhi with a mission statement — 'A plateful of food for every soul'. I worked on 40 logo ideas, 4 business stationery alternatives, 6 event poster options and website & app designs. The colour palette had 3 colours which I picked based on my research of what that other food brands generally use.

DISCIPLINES: Illustrator | InDesign | Photoshop

Being Gandhi | Branding & Event Marketing Collateral


DOODLING & LOGO EXPLORATION For the logo I wanted to experiment with typefaces from Gandhi's era, his handwriting, a slice of bread, a weaving machine, spoon, leaves, Gandhi's spectacles.

Being Gandhi | Branding & Event Marketing Collateral


BRAND GUIDELINES The logo I designed was a slice of bread with a fork inside, in the shape of the letter ‘g’ in the same style as Gandhi’s handwriting. I manipulated GoodHeadlinePro typeface for the brand name and used colours that resemble a bread.

Being Gandhi | Branding & Event Marketing Collateral


BUSINESS CARD

LETTERHEAD

The business card was

The letter head was also

designed to keep it simple,

designed to look minimal with

clean and minimal with a

the logo and a border as the

focus on the logo.

only highlighting elements in the design.

Being Gandhi | Branding & Event Marketing Collateral


EVENT POSTER I designed the event to be a food collection drive with a hashtag '#bookabarrel' for people to easily share about the event on social media. It urges people to book a barrel and go around the community collecting food for the needy in their neighbourhood. I designed the event poster with the intent to create awareness and incite curiosity. I illustrated a city skyline with empty hands rising to the sky asking for food and help. The dramatic colours of the sky adds to the mood of the campaign. The colour red was used to highlight and draw attention to the staggering statistics of the hunger issue.

Being Gandhi | Branding & Event Marketing Collateral


WEBSITE

Being Gandhi | Branding & Event Marketing Collateral


WEBSITE The website designs are minimal and clean made to resemble Gandhi's simplicity. The webpage has a 2 column modular layout. Important information and call to actions are highlighted in red.

Being Gandhi | Branding & Event Marketing Collateral


iPHONE APP

Being Gandhi | Branding & Event Marketing Collateral


iPHONE APP For the app I adopted a single column layout with noticeably big call to action buttons.

Being Gandhi | Branding & Event Marketing Collateral


Louboutin | Illustration and Marketing Campaign


LOUBOUTIN ILLUSTRATION MARKETING CAMPAIGN

DESIGN PROBLEM: Louboutin's Silky Satin Lip Colour is based on the alliance of luxurious colour, sensuous feel and superior wear. It is inspired by the Art Deco movement and Middle Eastern antiquities. The lipstick has a solid metal body which is reminiscent of a precious vial with a turretlike crown cap. I had to create a realistic illustration of the lipstick and a concept marketing campaign to promote the collection.

DESIGN PROCESS: To create the realistic illustration for the lipstick I started with developing the skeleton of the body and gradually added in layers of brush strokes, fills and transparency to create the final product. Before moving onto creating the marketing collaterals I researched on the Art Deco movement. Products created during that time included individually crafted luxury items designed with the intention to create a sleek and anti-traditional elegance that symbolized wealth and sophistication. The design was characterized by simple, symmetric and repetitive shapes. An extensive use of motifs that included foliage, and sun rays. (Source: britannica.com) Based on this research I created motifs thats were inspired from the movement and made them the basis of my designs.

DISCIPLINES: Illustrator | Photoshop

Louboutin | Illustration & Marketing Campaign


LIPSTICK ILLUSTRATION METHODOLGY

Louboutin | Illustration & Marketing Campaign


POSTERS For the posters I used a unique motif, from the Art Deco Movement, for each lipstick shade. The contents were all aligned centrally to draw focus. Large type was used at an angle to create movement. I used a variety of gradients to achieve a reflective effect.

Louboutin | Illustration & Marketing Campaign


SOCIAL MEDIA POSTS

Louboutin | Illustration & Marketing Campaign


SOCIAL MEDIA POSTS Social media posts were designed following the same theme from the posters. Each shade had a unique motif associated to it. I used gradients to create a rich gold effect to go with the luxurious feel. The posts were created to bring contrast from the regular image heavy posts used on the Louboutin Instagram account.

Louboutin | Illustration & Marketing Campaign


MAGAZINE AD

Louboutin | Illustration & Marketing Campaign


MAGAZINE AD The magazine ad was designed using varied lipstick shades from the collection and arranged to resemble a motif from the Art Deco, just like in the posters. I kept all important information centrally aligned and used a gradient gold effect to highlight the title of the collection.

Louboutin | Illustration & Marketing Campaign


WEB BANNER For the web banner I used motifs again but subtly in the background, flowing in and creating eye movement. I used the gold gradient effect to highlight the luxurious lipstick shine. A horizontal layout breaks away from the portrait structure seen in the posters.

Louboutin | Illustration & Marketing Campaign


Louboutin | Illustration & Marketing Campaign


Louboutin | Illustration and Marketing Campaign


KING KONG MOVIE CAMPAIGN RE-DESIGN

DESIGN PROBLEM: The aim of the project was to use primarily 'masking' techniques to re-design a movie poster, for any movie of my choice. I selected King Kong, a classic, remade periodically for new audiences. I wanted to create a poster to suit newer audiences but keep it dramatic and true to the movie’s powerful script. I also designed marketing collaterals for the movie.

DESIGN PROCESS: The design process involved studying the movies script and identifying the iconic scenes from the movie—King Kong holding Ann while being targeted by humans. I wanted to show the emotions King Kong and Ann felt for each other in my designs and yet be able to showcase his furiousness and gigantic frame. I also researched on other ambient advertising campaigns to incorporate it into my design solution. I selected an image with dramatic purple skies and used extensive masking techniques on photoshop, layers of curves to create the spotlight effects from helicopters, multiple blend modes to merge the elements with the background to create the entire scene.

DISCIPLINES: Photoshop | Illustrator

King Kong | Movie Campaign Re-Design


MOVIE BILLBOARD The bill board poster was designed as dramatically close to the script as possible—using dusky skies, city skylines in the distance, a barren land, Ann, King Kong trying to escape humans attacking him. My intent was to tell a story in the poster and re-create the iconic King Kong scene where he stands on the Empire State building fighting off planes. Using masking layers in Photoshop I added one character at a time to the picture on the right and was successfully able to create a movie scene.

BEFORE

King Kong | Movie Campaign Re-Design


King Kong | Movie Campaign Re-Design



WEBSITE LANDING PAGE As there was a lot happening on the billboard I wanted to create a webpage that was less busy by introducing white space. Therefore, I chose to invert the sizes of the poster elements—made the NY skyline gigantic and the ape smaller. The circular container helps draw focus on King Kong and also acts a path for links to the website pages.

WEBSITE BANNER The web banner is a stripped down version of the billboard poster. Focus is on the movie and introducing a call to action to watch the trailer.

King Kong | Movie Campaign Re-Design


BUS STOP POSTER Keeping the design in sync with the billboard poster, I used the same backdrop for the bus stop poster. However, here I introduced gamification by using a maze to keep the viewers at the bus stop engaged and that way have a higher re-call of the movie.

King Kong | Movie Campaign Re-Design


King Kong | Movie Campaign Re-Design


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.