design portfolio - akshay iyer

32
1 AKSHAY IYER UI/UX DESIGNER [email protected] +1 (347)-575 2054 Brooklyn, New York www.akshayiyer.in

Upload: akshay-iyer

Post on 21-Jan-2018

292 views

Category:

Documents


3 download

TRANSCRIPT

Page 1: Design Portfolio - Akshay Iyer

1

v

AKSHAY IYER

UI/UX DESIGNER

[email protected] +1 (347)-575 2054 Brooklyn, New York www.akshayiyer.in

Page 2: Design Portfolio - Akshay Iyer

2AI

ABOUT

EDUCATION

EXPERIENCE

ORGANIZATIONS

I’m Akshay Iyer; a programmer turned designer, that doesn’t mean I can’t code. I hail from Bombay and now call Brooklyn home. Currently, I am pursuing my Masters in Integrated Digital Media from New York University’s Tandon School of Engineer-ing. Things that excite me are Sketch, Illustrator, Coffee and Pizza. I wish to make a career as a designer and currently I am in the lookout for internship opportunities in the same. If you want to talk about UX or Web Designing, do let me know, Cof-fees on me.

New York UniversityTandon School of EngineeringMaster of Science (M.S.)Integrated Digital Media GPA : 3.9 2015-2017

University of MumbaiV.E.S. Institute of TechnologyBachelor of Engineering (B.E.)Information Technology GPA: 3.61 2010-2014

New York University - Information TechnologyWeb Publishing Student ConsultantNew York, NY, USA 2015-Present

Indus Valley Partners (India) Pvt. Ltd.Associate Software EngineerMumbai, MH, India 2014-2015

Computer Society of India, University of MumbaiStudent Chapter Head 2013-2014Secretary 2012-2013Junior Operations Officer 2011-2012

Page 3: Design Portfolio - Akshay Iyer

3AI

CONTENTSGotham Space AgencyFreshman Year Project, New York UniversityOctober 2015 - November 2015UX Design 04 - 07

Little Einstein Toy StoreFreshman Year Project, New York UniversitySeptember 2015UX Design 22 - 23

Buy Me ByFreshman Year Project, New York UniversityNovember 2015 - December 2015UX Design 08 - 11

Street StationFreshman Year Project, New York UniversitySeptember 2015UX Design 24 - 25

Virtual Stock MarketComputer Society of India, University of Mumbai January 2013 - August 2013UI Design 12 - 15

NYU Web PublishingIT Team, New York UniversityOctober 2015 - November 2015UI Design 26 - 27

CSI-VESIT ApplicationComputer Society of India, University of MumbaiNovember 2013 - January 2014UI Design 16 - 19

CSI-VESIT LOGO DESIGNComputer Society of India, University of MumbaiDecember 2013 - January 2014Logo Design 28 - 29

Email Filtering and AnalysisSenior Year Project, University of MumbaiJuly 2013 - April 2014UI Design 20 - 21

The ConnectionSophomore Year Project, University of MumbaiJanurary 2012 - April 2012UI Design 30 - 31

Page 4: Design Portfolio - Akshay Iyer

4

GOTHAM SPACE AGENCY

AI

This project focussed on designing the user experience for Gotham Space Agen-cy, a company that intends on launching a rocket into space, gather relevant infor-mation and implement it as education to middle school students.

Akshay Iyer

Inna Sheflyand

Tianyi Chen

Yun-Hsuan Lin

Sitemapping User Interviews Prototyping

User Research User Testing Sketching

Brainstorming Wireframing

User Personas Competitve Analysis

ABOUT

GOTHAM SPACE AGENCY

TEAM UX SKILLS

Page 5: Design Portfolio - Akshay Iyer

5GOTHAM SPACE AGENCY

Jane

Jane

Jane Jane Strategy

Goals

Sitemap

Brainstorming

Personas

Analysis

David

Irene

Jake

Danielle

Middle school teacher

36 years old. Thinks digital devic-es are great for schools, but worries they may distract, hates content heavy pages, and likes easily naviga-tabe websites

Retired police officer

40 year old Air Force Pilot, is an ex-tremely organized person. He likes to play simulation games a lot, and is on the constant lookout for games with educational components.

School going girl

11 year old, 5th grade student. She loves to watch videos on YouTube and websites with interactions. She dreams to meet an astronaut and hopes space travel will be public.

Middle school student

12 year old from Brooklyn. He loves to collect old posters and he thinks that websites should only contain an-imations and images, He has limited access to computers.

9th grader

15 year old from New York. She likes to shop online, but she hates ad-vertisement pop-ups. Danielle is in-trigued by the fact that water was found on Mars.

AI

Started with brainstorming; the team de-veloped numerous conceptual ideas. Per-forming competitive analysis and extensive research will help to narrow down the view and identify gaps. Based on sketches and paper prototypes, the initial wireframes will be created and tested. User testing will be performed, with a minimum of twenty us-ers. Wireframe iterations will be done after each user testing round. Iter ations will also be changed based on the feedback from clients. Final wireframes were presented to the client on November 10th, 2015.

Create an online user experience, by provid-ing visual aspects of the mission, encour-age interactions to keep user engagement and re-engagement, provide seamless web usability, inspire parents, teachers and stu-dents to be actively involved in possible learning opportunities that the whole proj-ect may bring.

Various factors were taken into consideration such as media outlets in use by children, apps, websites, Instagram, latest trends on what keeps kids interested in their daily activities, cartoons, NASA exper-iments, satellites, ISS, space news, games.

RESEARCH

Page 6: Design Portfolio - Akshay Iyer

6AI

PROCESS

“More efficient timeline, should be much simpler and understandable”

“Details of each event consisted of unnecessary content”

User Testing

Idea

Wireframe

“Didn’t understand the placeholder information at first”

“Need to be consistent across the entire website”

“The countdown needs to stand out, doesn’t look like one“

GOTHAM SPACE AGENCY

Page 7: Design Portfolio - Akshay Iyer

7AI

News Wall

Character Gallery

Countdown Timer

Activity Panel

Timeline

Provides continuous updates regarding the happenings in social media such as Twit-ter and Instagram. It also includes news feeds regard-ing the developments taking place at Gotham Space, the ISS and the news from space.

Consists of a list of all the player pro-files and the avatar characters which were created by them before the mis-sion. The same panel, after the launch of the rocket, gets updated to show live tracking of the satellite and infor-mation regarding the launch of the rocket. Information provided includes amplitude, humidity, atmospheric pres-sure, etc.

The countdown timer remains through the mission timeline. It provides infor-mation regarding all the happenings such as the time to launch, the time it takes the rocket to reach space, the time it remains in space, and the time taken by it to re-enter into the earth. It also tells the user as to when the next experiment is conducted, when will the next spacewalk take place, etc.

The activity panel is the primary source of all the information that is communi-cated from the space station. It provides images, audio notes, videos and news articles from the internet. Each of these panels contains information of import-ant moments ordered by date. During the launch phase, the entire panel gets replaced by a video player showing live footage of the satellite being launched.

The timeline allows users to keep track of activities that were con-ducted. It enables users to go back in time, to read about past activities, or go ahead in front to know about the upcoming events.

PROTOTYPE

GOTHAM SPACE AGENCY

Page 8: Design Portfolio - Akshay Iyer

8

BUY ME BY

AI

This project focussed on designing the user experience to man-age the price of a product dynamically depending upon its expi-ration date. A mobile application was prototyped, and mockups for the application were created.

ABOUT

Sitemapping Sketching Prototyping

User Research User Testing

Surveys Wireframing

User Personas Competitve Analysis

UX SKILLS

BUY ME BY

Page 9: Design Portfolio - Akshay Iyer

9

Jane

JanePersonas

SitemapInternational Student

21 year old. He loves online and mo-bile e-commerce and his favourite social networking website is face-book. He lives on a fixed budget and doesn’t mind travelling.

Head Chef

35 year old. She is a mother of two kids and extremely organized. She does not like to travel much, loves to use her iPad, however not comfort-able with net payments.

New Yorker

23 year old student studying at NYU. He loves to shop from Amazon, but he hates advertisement pop-ups. He enjoys house parties and he loves to host them as well.

Dylan

Erica

Alan

The idea was initially ideated based on data gathered from the user research con-ducted and the surveys which were taken at the ideation stage. Later user personas and user flows were created, and the ini-tial design was created using Balsamiq mockups. Upon careful user testing and obtaining user feedback, the design was iterated further and tested again. After a few rounds of user testing, a final proto-type and a hi-fi mockup of the application was created.

The primary goal of this project is to avoid food wastage which is a critical problem faced by many locations in the United States. A large number of perishable food products are going waste by expiring, and they are sent to food banks. BuyMeBy is an application with which the user will be enabled to shop for perishable products by focussing on their expiration date and based on that the price is fixed. The cost decreases as the product reaches its expi-ration date. The user could buy, or block a product and later pick it up from a nearby store.A survey was conducted to gain user feedback on a few pain

points which appeared during the ideation stage. Multiple ques-tions were asked and later quantified.

AI

Strategy

Goals

Survey

RESEARCH

BUY ME BY

Page 10: Design Portfolio - Akshay Iyer

10AI

“Option of quick buy or a preferred place purchase should be included”

“It would be a good thing to include specific brands for each product.”

“No seperate page for checking out, could be included with the cart

“Include MRP along with the discounted rate”

“One click sign-up using Facebook and Google“

PROCESS

BUY ME BY

User Testing

Page 11: Design Portfolio - Akshay Iyer

11AI

The final mockup was created using sketch. It consists of all the screens which will be developed and will ap-pear as the application is being draft-ed. The same has been prototyped on InVision, and a small amount of user testing, for understanding the visual aspects was also conducted.

HI-FI Mockup

PROTOTYPE

Settings Product

MenuMap Page

Cart

BUY ME BY

Page 12: Design Portfolio - Akshay Iyer

12

VIRTUAL STOCK MARKET

AI

ABOUT

This project was an online gaming appli-cation which focussed on buying, selling and trading of stocks. It provided historical analysis, showing the variation of the price of each stock with time. The amount of each stock varies through news updates.

Akshay Iyer

Rahul Ravindran

Rohan Tondulkar

HTML Photoshop

CSS MYSQL

JAVA SCRIPT

PHP

TEAM SKILLS

VIRTUAL STOCK MARKET

Page 13: Design Portfolio - Akshay Iyer

13AI

Virtual Stock Market, is an online gaming event which is conducted by the Computer Society of India, on an annual basis. The us-ers have the ability to create their portfolio profile, buy stocks, sell stocks and improve their merit score. The price associated with each stock is analysed and decided based on a news feed which is available to each user as a live Twitter feed. The variation in the value of each stock is also shown visu-ally using graphs and charts. Factors such as brokerage fees, shutting down of com-panies, were also included.

A brainstorming session was conducted by the entire team of the Computer Society of India, to get an idea of how the event need-ed to be conducted. Proposals to manage the event on a grand scale offline were also taken into consideration. Later on, the stock market was analysed and points were taken by understanding its work-ing, its pressure points, its highs and lows. Various factors such as short sell and buy back were also considered but were later scrapped off as it would have confused a user with no stock market knowledge.

The major goal of this event was to reach as many homes as possible and to be con-ducted on a grand scale. Along with this, it would have been helpful for every player to gain knowledge and a basic understanding of how the stock market works.

Overview

Strategy

Goals

PROTOTYPE

VIRTUAL STOCK MARKET

Design Iterations

Page 14: Design Portfolio - Akshay Iyer

14AI VIRTUAL STOCK MARKET

DESIGN

Promotional Poster

Page 15: Design Portfolio - Akshay Iyer

15AI

DESIGN

VIRTUAL STOCK MARKET

Page 16: Design Portfolio - Akshay Iyer

16

CSI-VESIT APPLICATION

AI

ABOUT

Designed the application of CSI-VESIT by providing a sleek user in-terface, rich in functionality. Integrated Facebook, Instagram, and IGN through which users can gain access to updates by the organization. Added new features that enabled events such as Virtual Stock Market to be accessible through the application. The app also allowed uses to get information regarding upcoming events, seminars, workshops.

Akshay Iyer

Rahul Ravindran

Rohan Tondulkar

JAVA

Photoshop

Android SDK

Illustrator

TEAM SKILLS

CSI-VESIT APPLICATION

Page 17: Design Portfolio - Akshay Iyer

17AI

The CSI-VESIT Android application provided members with profound insights of all the activities that are being conducted. The members could get access to various con-tent such as upcoming events, upcoming workshops, the latest happenings in technology, and even publications of CSI. Facebook, Instagram, IGN and Google Cloud Messen-ger were integrated so that promotional activities could be conducted. Functionality was also integrated so that the Virtual Stock Market event could also be played using the Android application.

User testing was conducted on the application al-ready existing and based on the feedback which was receiveda design was iterated on paper. Each event comprised of a particular logo, which was created as well in photoshop to give a uniform look to the whole application. To evenly theme the application with the logo, the entire applica-tion was designed in black. Incorporation of so-cial media was done using the SDK’s provided by their developers. Over the course of time, many events were also to be incorporated to be con-ducted via the app.

Overview

Previous Design

Strategy

ANALYSIS

CSI-VESIT APPLICATION

Page 18: Design Portfolio - Akshay Iyer

18AI

PROTOTYPE

The primary goal of creating this An-droid application was to connect with the members in a more comfortable manner. The world was gradually pro-gressing towards the use of smart-phones and tablets and it was time that we get CSI-VESIT into hand-held devices. Moreover, CSI-VESIT was the first society to incorporate an appli-cation into a handheld device and there needed to be constant techno-logical updates in order to keep the members engaged.

Goals

CSI-VESIT APPLICATION

Promotional Poster

Page 19: Design Portfolio - Akshay Iyer

19AI

DESIGN

CSI-VESIT APPLICATION

Details Menu

InstagramTeam Page

Page 20: Design Portfolio - Akshay Iyer

20

EMAIL FILTERING AND ANALYSIS

AI

ABOUTThis project focussed on, analysing e-mails and clas-sifying them based on two different algorithms, the Naive Bayes algorithm and the C4.5 Algorithm. It also allowed analysis of historical e-mails to get statistical reports regarding spam and the variations in the same across time.

Akshay Iyer

Akanksha Pandey

Karmanya Pathak

Dipti Pamnani

TEAM

JAVA SWING

JSP

MYSQL

SKILLS

EMAIL FILTERING AND ANALYSIS

Page 21: Design Portfolio - Akshay Iyer

21AI

Overview

Strategy

This project primarily focussed on classifying e-mails using two classification algorithms and compare the results, so that it was possible to find which one is more efficient. The application also served as a desktop client with which the users could manage his e-mail, receive and reply to e-mails, even forward them. We made use of the SMTP and IMAP mail servers to achieve the same. The user could also define specific key-words by which the e-mails could get classified. Along with this, we also provided with a statis-tical analysis of all the e-mails, so as to provide information regarding spam content which is getting accumulated over time.

Initially, the entire process was laid down on pa-per and site mapped to get an idea of how the entire application would flow. Careful analysis was done to understand whether it would be a desktop application or a mobile application. Af-ter this stage, the app was put into development and iterated in steps till the final product was de-signed.

EMAIL FILTERING AND ANALYSIS

DESIGN

Page 22: Design Portfolio - Akshay Iyer

22AI

LITTLEEINSTEIN

TOYSTORE

ABOUTThis project focussed on designing the user ex-perience for Little Einstein Toy Store, an e-com-merce company that sells products concentrating on technology and electronic products geared to-wards kids aged 4-15.

Akshay Iyer

Geoff DuVall

Ryan Thibeault

TEAMSitemapping

User Research

User Personas

User Flows

Wireframing

Paper Prototyping

User Testing

UX SKILLS

LITTLE EINSTEIN TOY STORE

Page 23: Design Portfolio - Akshay Iyer

23

Category

Slider

Cart

Menu Bar

History

Login

All the products being sold by this online e-commerce portal are arranged as per category and can be easily accessed by this section

The sliding window pro-vides information regard-ing trending products, upcoming sale, etc.

Keeps track of all the products being purchased by the user.

Consists of all options relevant to sale such as best sellers, products on sale. There is also an about us page which contains infor-mation regarding the store and a contact us page, which provides an online form that can be sent via e-mail.

Keeps track of all the recent prod-ucts searched by the user.

Lets users create individual profiles and shop. A guest feature also available if the user isn’t a frequent buyer and wishes not to make a website account.

SearchAllows easier access to products.

AI

Overview

Strategy

The primary goal for Little Einstein is to become the #1 resource for parents that want to incorporate hands-on STEAM educa-tion into their child’s everyday learning experience. This new website will reflect the STEAM-focused Philosophy of Little Ein-stein by featuring new, innovative products while at the same time maintaining a fun and creative vibe.

User personas were being analysed and based on them; a paper proto-type was created and tested. Based on the testing feedback received, more iterations of the paper proto-type and later an interactive proto-type was established and tested.

LITTLE EINSTEIN TOY STORE

PROTOTYPE

Page 24: Design Portfolio - Akshay Iyer

24AI

STREETSTATION

Akshay Iyer

Tianyi Chen

TEAMSitemapping

Situational Analysis

Interactive Wireframing

User Testing

Paper Prototyping

UX SKILLSABOUTThis project was developed as the solution to a situational problem faced by Tianyi. Tianyi has a problem finding the right entrance to the subway sta-tion, which leads her to getting into the incorrect train. This app would guide her in finding the right entrance.

STREET STATION

Page 25: Design Portfolio - Akshay Iyer

25AI

OverviewStreet Station is a mobile appli-cation which will enable the user to avoid entering an incorrect en-trance to a subway station. The prototype provides visual imag-ery and available options based on your position on the street.

DESIGN

VisualDirection

Paper Prototype

Entrance

STREET STATION

Page 26: Design Portfolio - Akshay Iyer

26AI

NYUWEBPUBLISHINGABOUT

This design prototype was developed for the New York University’s Web Publishing Team. The Web Publishing Page on the NYU website did not provide the relevant information, in an organised manner. There was a lack of visual information, and moreover, much development had taken place since the page was initially created. A web prototype, providing detailed information about the web publishing team was established for the same.

Photoshop

Axure RP

TOOLS

NYU WEB PUBLISHING

Page 27: Design Portfolio - Akshay Iyer

27AI

OverviewThe NYU Web Publishing team required chang-ing the entire look of their page which appears on the website of New York University. The new page design has access to more links, imagery and has information that is highly organised. More links are available enabling NYU students, faculty and staff to access relevant documenta-tion when required.

DESIGN

NYU WEB PUBLISHING

Page 28: Design Portfolio - Akshay Iyer

28AI

CSI-VESITLOGO

DESIGNABOUT

Re-designed the logo of CSI-VESIT, which will be used across all the ac-tivities which are being conducted throughout the academic year and for further years.

Photoshop

SKILLS

CSI-VESIT LOGO DESIGN

Page 29: Design Portfolio - Akshay Iyer

29AI

CSI-VESITDesign Ideas

DESIGN

OverviewThis project consisted of re-designing the logo of CSI-VESIT. Various ideas were fostered which focussed on the central part of the previous logo and based on which, multiple iterations for the logo were made. After carefully analysing the process and gaining user feedback, the final logo was designed and released.

CSI-VESIT LOGO DESIGN

Page 30: Design Portfolio - Akshay Iyer

30AI

THECONNECTION

Akshay Iyer

Gaurav Keswani

Priyanka Asrani

TEAM

HTML

CSS

JSP

MySQL

SKILLS

ABOUTThis project is an online job hunting portal, which enabled users to search for organisa-tions and the available employ-ment opportunities. It included additional features for creating user profiles, session tracking. It also allowed companies to create company profiles and enabled them to look out for prospective candidates.

THE CONNECTION

Page 31: Design Portfolio - Akshay Iyer

31AI

Overview

Strategy

This website was developed with an intention to connect employers with employees. The user looking for a job had an opportunity to create a profile, edit it, upload his resume, etc. The com-pany on the other hand could post their compa-ny description and also their requirements. The employers were dynamically linked with the em-ployees based on the former’s requirements and the latter’s skill set.

Comparative analysis was done on the websites which were already existing and based on that, points were noted down. The website was lat-er developed after carefully analysing every is-sue and problems which were deduced from the comparative analysis.

DESIGN

THE CONNECTION

Page 32: Design Portfolio - Akshay Iyer

www.fb.com/ak.iyer1992

@Akshay_Iyer92

www.linkedin.com/in/iyerakshay

© AKSHAY IYER ALL RIGHTS RESERVED