Transcript
Page 1: Ashfaq Amin's UX Portfolio

Ashfaq AminUX Designer, Researcher

[email protected] +1 604.396.8272 linkedin.com/in/ashfaqamin

Page 2: Ashfaq Amin's UX Portfolio

BSc. in Computer Science & Engineering

Bangladesh University of Engineering & Technology

2007 2012 2013 2014 20162015

MSc. in Interactive Arts & Technology

Simon Fraser University (SFU)

2010

Junior Engineer Mukto Software Ltd.

Software Engineer Mukto Software Ltd.

UI Designer Playdom

(Disney Interactive)

UX Designer Grameenphone Ltd.

(Telenor Group)

Freelance UX Designer via Toptal

Research Assistant Pain Studies Lab, SFU

Teaching Assistant IAT 235: Information Design

Short BioAbout Me

Page 3: Ashfaq Amin's UX Portfolio

DISCOVERY

Stakeholder Interviews Card Sorting

Surveys

STRATEGY

Personas Scenarios Workflow Maps Customer Journey

DESIGN

Information Architecture Wireframes Prototypes

IMPLEMENTATION

Style Guideline UX Specification Service Blueprint

TEST

Lab Evaluation In-depth Interviews Focus Group Guerrilla Tests

Celebrate

UX ProcessAbout Me

Page 4: Ashfaq Amin's UX Portfolio

UX Projects

Page 5: Ashfaq Amin's UX Portfolio

The Arc US

Data Gathering App Freelance UX Project via Toptal

Use Case Scenarios Wireframe Interactive Prototype Visual Design

Page 6: Ashfaq Amin's UX Portfolio

I started the project by identifying the use cases, scenarios and user roles for the system and outlined the draft process architecture to work in sync with the dev team.

Page 7: Ashfaq Amin's UX Portfolio

I sketched all the pages I have identified in my info architecture to communicate my ideas with the remote teams and used them for the wireframes.

Page 8: Ashfaq Amin's UX Portfolio

WireframesData Gathering App

After initial sketching I made grey-box wireframes in Axure RP. I made wireframes for mobile and desktop screens along with some mid-fidelity interactions in 2 iterations.

Page 9: Ashfaq Amin's UX Portfolio

I made the high-fidelity mockup in Axure RP. The colors are picked for The Arc’s brand guidelines. The UI Elements and interactions mostly follow the material design guidelines.

High Fidelity MockupData Gathering App

Page 10: Ashfaq Amin's UX Portfolio

First Time Experience with Grameenphone (GP)

A Service-design project for the customers of Grameenphone (GP) Ltd., the largest telecom operator in Bangladesh. By resolving the existing problems, this project aimed at making the SIM activation, Package discovery, Browsing internet and Finding Information a seamless experience for the new customers.

Service Design UX Research Multi Channel Experience

Interaction Design Visual Design

Page 11: Ashfaq Amin's UX Portfolio

When a customer buys a GP connection for the first time, instantaneously they should be able to make calls, send sms, browse internet, add FnFs and discover voice and internet packages.

Baseline research showed that the first time success rates for these major user tasks were significantly low.

30%A staggering 70% test users were unable to perform very basic tasks like–package change, FnF management, internet activation.

20%Only 20% customers were able to identify their current call rates.

I conducted baseline research with existing customers to find out the problem areas and outline project scope.

Baseline ResearchFirst Time UX

Page 12: Ashfaq Amin's UX Portfolio

Voice Internet

Retail Stores

WebMedia

Advertisements

SMS, USSD

GP Devices

Smartphone App

Customer Support

First Time Experience was a one-year project which aimed at improving the whole GP multi-channel experience.

I was involved in the UX process for all the channels.

However, my major contributions were in the sections highlighted in blue.

Project ScopeFirst Time UX

Page 13: Ashfaq Amin's UX Portfolio

The UX team proposed modifications for the existing Grameenphone (GP) smartphone app to improve the first time experience.

I made wireframes on Paper and Balsamiq for the new app and, made a mid-fidelity mockup with interactions using Balsamiq.

IDEATION AND USER FLOW

PAPER WIREFRAMES

BALSAMIQ MOCKUPS

GP Mobile AppFirst Time UX

Page 14: Ashfaq Amin's UX Portfolio

I simplified the Unstructured Supplementary Service Data (USSD) to ensure Package change, FnF management, Internet activation.

BEFORE

30%With previous USSD instructions success rate was very poor.

AFTER

90%After simplification the success rate was 90%

Based on the findings of my initial user studies, I simplified the instructions for FnF management. I tested and refined the instructions in 3 iterations. For fast testing and refinement I used Whatsapp during the interview process.

PROTOTYPE

User Input

Demo System Response

Instructions for the users for task based user tests.

Process SimplificationFirst Time UX

Page 15: Ashfaq Amin's UX Portfolio

As part of SIM KIT Redesign, I simplified the existing SIM manual.

WORD REDUCTION

60%My first prototype resulted in a 60% word reduction which ensured the ease of finding different information.

I designed the final high-fidelity prototype manual in Adobe Photoshop.

BEFORE

AFTER

User Manual DesignFirst Time UX

Page 16: Ashfaq Amin's UX Portfolio

With the GP UX team I conducted user research through field tests and lab interviews to identify and create the Personas.

I identified scenarios for different user groups and made scenario based UX guidelines for GP internet subscribers.

PERSONAS

SCENARIOS

Personas, ScenariosFirst Time UX

Page 17: Ashfaq Amin's UX Portfolio

For different user segments I created customer journey maps for existing processes and my proposed solution to properly identify and communicate the solution gaps and problems.

Customer Journey MapsFirst Time UX

Page 18: Ashfaq Amin's UX Portfolio

A lot of GP customers, especially the ones in the rural areas, buy smartphones sold by GP. Most of these phones are low priced and imported from 3rd party vendors.

I made a device guideline so that every time GP brings a new handset to the market there is no need for the UX team to do the inspections.

I documented and presented this guideline for all the teams working in GP.

DEVICE GUIDELINE

UX Guidelines and DocumentationFirst Time UX

Page 19: Ashfaq Amin's UX Portfolio

I identified scenarios of different user groups and made guidelines accordingly.

INTERNET GUIDELINE

To improve the communication on the website about internet packages I created and tested different wireframes layouts.

Identified process flows in different scenarios and, made guidelines for simplification.

UX Guidelines and DocumentationFirst Time UX

Page 20: Ashfaq Amin's UX Portfolio

In the discovery and baseline research phase I conducted in-depth interviews with current costumers to find out existing problems. Also, I conducted usability tests with existing processes and customers.

After analysis and documentation, I communicated my findings across all the stakeholder teams in this projects.

User ResearchFirst Time UX

Page 21: Ashfaq Amin's UX Portfolio

I conducted Guerrilla Tests with the UX team before and after implementation of the different phases of the project.

I led focus groups with different customer segments to test GP products across multiple channels.

User ResearchFirst Time UX

Page 22: Ashfaq Amin's UX Portfolio

MerchBee Freelance UX Project via Toptal

MerchBee is a holistic web-based software dedicated to Amazon merchants. I made the designs for 4 sections of this system – a. Email Builder, b. Feedback Monitoring, c. Signup, d. My Account.

Interaction Design Visual Design

HTML5/CSS3

Interactive Prototype

Responsive Website

Page 23: Ashfaq Amin's UX Portfolio

Based on the client’s brief and project specification I started by creating low-fidelity wireframes for desktop platforms. I refined the wireframes from low to high-fidelity in 2 iterations based on the feedback from the project owner and back-end developers. I made the complete visual design on the 3rd iteration.

ITERATION–1 WIREFRAMES

SketchesMerchBee

Page 24: Ashfaq Amin's UX Portfolio

MerchBee Wireframes

In the 2nd iteration I made wireframes for all 4 sections of the system for both Desktop and Mobile screens.

I wireframed more than 20 different page layouts for both kinds of screen sizes.

ITERATION–2 WIREFRAMES

Page 25: Ashfaq Amin's UX Portfolio

ITERATION–2 WIREFRAME IN BALSAMIQ FINAL VISUAL DESIGN IN PHOTOSHOP

UX IterationsMerchBee

Page 26: Ashfaq Amin's UX Portfolio

I wireframed all the responsive layouts for the mobile screens and created visual designs for some of the pages.

Responsive DesignMerchBee

Page 27: Ashfaq Amin's UX Portfolio

I made a html5 prototype using Bootstrap framework to jump start the development process. I did not develop the front-end for the whole system. However, I created the prototype as a skeleton and documented visual design guidelines for the front-end developer.

DESKTOP SCREEN MOBILE SCREEN

High Fidelity PrototypeMerchBee

Page 28: Ashfaq Amin's UX Portfolio

Your HotelDesign Exercise

Interaction Design Rapid Prototyping

Page 29: Ashfaq Amin's UX Portfolio

GP StoreWeb-based Content Store

Grameenphone Ltd.

Service Design User research

Rapid Prototyping Responsive

Visual Design

Page 30: Ashfaq Amin's UX Portfolio

Zap MultiplySerious Game (iOS)

Game Design Artworks UI Design

Page 31: Ashfaq Amin's UX Portfolio

Behance Portfolio www.behance.net/ashfaqamin

I have worked on a few mobile applications, web-based applications and mobile games. Please visit this portfolio to view those projects.

Traditional Paintings and Sketches http://ashfaq-ayon.deviantart.com/gallery/

I am trained and skilled in traditional forms of painting and sketching. E.g., Charcoal and Pencil sketching, Oil, Watercolor and Acrylic painting, Digital painting and Photo retouching.

Page 32: Ashfaq Amin's UX Portfolio

Thank You.

[email protected] +1 604.396.8272 linkedin.com/in/ashfaqamin


Top Related