PORTFOLIO USER INTERFACE | USER EXPERIENCE | BRAND | MARKETING
SHUBHAM SHREYA +91 750 755 1066 shubham.graphicdesign@gmail.com
ABOUT Paradigm is an app for investment beginners. Aimed at the layman, it gives the user the power to manage, save and multiply their money, with a simplistic approach, devoid of finance jargons.
PARADIGM
SCOPE • Research • User Interface • User Experience • Wireframes • User Journey • Task Flows • Visual Design SOFTWARE: Sketch, Adobe Illustrator
Research
User Personas
User journeys
DESIGN PROCESS
Task flows
User Interface (UI) Design
Wireframe
Information Architecture
PAPER WIREFRAMES
Make an investment
User Interface Design
Paradigm believes in letting you create and control your money and give you the power to change your future.
User Interface Design | Details
User Interface Design | Details
User Interface Design | Details
ABOUT This is the design journey of an accountancy software, for a UK based company looking for an entire rebrand of it’s product.
ACCOUNTANCY
SCOPE • Research • Heuristic evaluation • User Interviews • Workshops • User Interface • User Experience • Wireframes • User Journey • Task Flows • Visual Design SOFTWARE: Sketch, Balsamiq, Adobe Illustrator
DESIGN PROCESS
Heuristic evaluation
Ethnographic research
Evaluation & user testing
User profiles & persona
User Interface (UI) Design
Use cases & scenarios
Wireframe
User journeys
Information Architecture
Task flows
Data analysis
Ethnographic research & workshop (London)
Information Architecture (IA)
User profiles
ACCOUNTANTS Language proficiency Domain expertise General education
English: Expert
BUSINESS OWNERS
English: Expert
ADMINISTRATORS
DESIGN IMPACT
English: Expert
• • •
Writing style and level Labelling and layout Alternation versions Documentation, training and help
Expert
Average to Expert
Expert
•
Qualifying degree
General degree to qualifying degree
Qualifying degree
•
Writing style and level Modality Wizards, tool tips Mnemonics, accelerators
General computer knowledge
Tech savvy
Tech savvy
Tech savvy
• • •
Age
25+ years
18+ years
30+ years
•
Font size, color, contrast
Functional, clarity in structure
• • •
UI structure, themes Tutorials, help Detail design, complexity
Expectations
Intuitive interface with clear functions
Easy to learn, helpful for the business
High-Level Wireframes
High-Level Wireframes
High-Level Wireframes
User Interface Design: Setting design language
• • • •
Brand extension by use of colours derived from logo San-serif font with multiple weights, for optimum readability Minimal icon style for clarity Flat UI to keep up with trends and general convention
User Interface Design
User Interface Design
User Interface Design
User Interface Design
ABOUT Disaster Assist is an app built to aid people at the time of disasters - case in point is natural disaster due to floods. It connects help seekers and help providers.
DISASTER ASSIST
SCOPE • Research • User Interface • User Experience • Wireframes • User Journey • Task Flows • Visual Design SOFTWARE: Sketch, Adobe Illustrator
Research
User Stories
Use cases
Wireframe
Information Architecture
User journeys
DESIGN PROCESS User Interface (UI) Design
Task flows
RESEARCH INSIGHTS • First responders are localites. Their knowledge about areas proves most useful • Overflow of supplies in some rehabilitation areas, while others have a lack • Many services and non-experienced help needed in most camps - but volunteers are not aware of the avenues • Theft and security issues • Lot of misguided and haphazard relief efforts
USER INSIGHTS • Reaching a safe zone (mostly home) is top priority. Victims want to know how much time it would take to do so in the current scenario. • Communication with others about their and own safety is essential • Getting updates on what is happening damage as well as relief efforts
•
Internal groups started forming to tackle the situation, in the case of people who were stranded at public places like offices, stations etc.
• Would have liked prior intimation and action from concerned authorities. • Localities were forming isolated rescue and help parties
INFORMATION ARCHITECTURE • The help provider can become the help seeker and vice versa. The design is done keeping in mind that the app can be a common platform for both these situations • App uses GPS data to pin-point location in case of emergencies. • The app sends out a push-alert to all registered users in case of imminent calamities and issues a warning - asking people to turn on the location services. This helps ascertain the locations of the responders and potential victims and the operation zones • App onboarding sensitises users towards various features and when to use them
PAPER WIREFRAMES Homescreen
Volunteer - Services
Volunteer- Main
Services - display
Services - details
PAPER WIREFRAMES Homescreen
Volunteer - Supplies
Volunteer- Main
Supplies screen
Supplies - selected
User Interface Design
User Interface Design | Details
User Interface Design | Details
ABOUT Ivan’s Ice Cream was looking for an app design that would reflect their fun and colourful flavours and appeal to the youth.
IVAN’S ICECREAMS!
SCOPE • User Interface • User Experience • User Journey • Task Flow • Visual Design SOFTWARE: Adobe Illustrator
APP SCREENS
ABOUT The mobile application for a jet-fuel company needed to be redesigned taking into consideration the user’s environment.
JET. SET. FUEL!
SCOPE • User Interface • Visual Design SOFTWARE: Adobe Illustrator
BEFORE • • • •
Cluttered Indistinct Over-use of color Lack of visual hierarchy
AFTER
• • • •
OR
Simplified UI and UX Functional hierarchy of elements Use of icons for aesthetic balance Use of larger buttons with accurate labelling for better usability and accessibility
4
ABOUT Company Lorem was looking for an intuitive dashboard design for their multi-user web app, with customisable widgets and personalisation options.
DASHBOARD DESIGN
SCOPE • User Interface • Task Flow • User Journey • Information Architecture • Visual Design SOFTWARE: Adobe Illustrator
DASHBOARD UI
WIDGET CUSTOMISATION
ABOUT The following are brief overviews of branding projects undertaken at various times with multiple clients.
BRANDS ETC.
SCOPE • Branding • Logo design • Collateral design • Packaging • Marketing TOOLS: • Pen and paper! • Adobe Illustrator • Adobe Photoshop • Adobe Indesign
Sharp Intelligent Digital Corporate Experienced Professional
Energetic Young Aspirational
Fun Youthful Delicious Unique
IXORA Branding and packaging work for a hypothetical brand Ixora, was featured in a two page spread of the book Infinite Pattern, by Sandu Publications, China.