Work Samples - conceptell.comconceptell.com/atulweb/assets/resources/Atul_UX-Portfolio.pdf ·...

Work Samples

Atul Handa

Credit Card Limit Increase (Online Banking)

About

The purpose of this online initiative was to increase incremental limit on credit cards by

providing clients the option of:

1. Accepting the maximum amount of credit they qualify for on their existing credit card

when they ask for a credit limit increase

2. Accepting a user-defined limit even if the current limit plus the limit increase is more

than the client’s over-limit balance

Key User Needs

There is an exiting simpler limit-increase flow customers are used to. Make the process

appear similar to the existing one, keeping it familiar for the users.

In spite of the new complexity, present users with all available options in a clear, non-

confusing manner. The system feedback should help users finish the task without errors or

difficulties.

Key Business Goals

Promote acceptance of maximum limit, yet duly inform customers of other options

Encourage user to finish the process and not abandon mid-way

Personas

Ryan Hill, 28 – Gaming Programmer; Degree in Computer Tech.

“I love to spend on technology and gadgets. If I want something, I

can’t wait…”

“I earn, I spend….saving is not a big priority right now.”

Motivation: Make big purchases using a credit card

Tasks: Determine current limit; find maximum allowed limit;

increase credit limit just enough to cover a purchase

_________________________________________________________________

Rita Gomez, 24 – Convenience Store Clerk; Immigrant; Single mom;

2 kids; High-school Education

“I work two jobs to pay bills, it is still tough.”

“I use my credit cards a lot. They are often maxed out.”

Motivation: Use credit cards to pay bills; buy groceries

Tasks: Determine current limit; find maximum allowed limit;

Increase limit to the maximum allowable


Design Considerations

To meet business and user needs, the design concept called for the

following:

1) Rather than focus on minimizing steps in the process, the focus was

on creating a seamless flow. The aim was to have users understand

what is required in terms of input, as well as the expected results of

their action. Additional steps were added to keep the content in every

step to a minimum and decrease the cognitive load of the user.

2) To encourage users to continue, they were helped along by

minimizing the number of required fields. They were provided

constant feedback on the system status; clear options and an

opportunity to make changes at each step.

3) Default setting/values at each step conformed to business goals.

4) Before final submission, the user was adequately warned of any

possible outcomes that were not normally expected.

5) At the end, the user was presented with a clear outcome of his/her

actions and importantly, what to expect next.

UX Research and Design

Stakeholder Meetings

Personas, User Scenarios

Wireframes

& PrototypesUsability Testing

GUI Specifications

Heuristic Reviews

Build


Process Flow


Wireframes / Prototypes


GUI Specs

Responsive Website (Spice Electronics)

About

Spice Electronics (SE), headquartered in Ontario, is a new global

distributor of electronic components. SE was looking for a web and

mobile presence that informs potential customers and clients about

the company and its products and services.

Key User Needs

Quickly establish if the vendor meets theirs needs

(products/suppliers).

Easily communicate with the vendor and seek quick quotes.

Get a “feel” for reliability and quality standards at a glance.

Access vendor website on both desktop and mobile platforms.

Key Business Goals

Present SE as a reliable organization, increase its recognition and

instill customer confidence in the brand

Provide an easy interface to view/search its products and services

and a channel to invite queries and requests for quotes

Primary Persona

Sam Roberts, 42,

Procurement Manager, Innovotronics Corp.,

Scarborough, ON

“I’m constantly seeking new suppliers/brokers to get the best value for money to meet our tight

bottom-line…always looking for a deal.”

“I prefer suppliers I can deal with locally.”

Motivation : Get the best deals for the company

Tasks Find new local suppliers, distributors to meet changing needs; get and compare quotes;

search/peruse inventories online; quickly connect to get queries answered

Percentage of use: 25% (2 hours a day)

_____________________________________________________________________________________________

Secondary Persona

Mohammad Karim, 32,

Business owner, KJX Equipment Repairs,

Mississauga, ON

“I sometimes need parts that are out of stock or not in production. I want a long-term

relationship with a reliable supplier.”

“I am a small buyer, I can’t afford to lose money due to defective parts.”

Motivation: Long term, reliable sourcing of hard-to-find parts

Tasks: Find information about quality, guarantee & customer service; easy online RFQ and

inventory search

Percentage of Use: >10% (4 hours a week)



The design focused on the following:

1) Meet the key user needs on the homepage itself.

I. Use minimal text to explain the salient features of the company

(carousel)

II. Establish trust through testimonials and “Why us”

III. Single click to quotes

2) Create Information Architecture based on industry norms and

terminology

3) Provide contextual call-to-action/information ( a key user need) on all

pages (considering that any page is a potential entry point to the

site.)

4) Multiple modes to find products/suppliers:

1) “At-a-glance” lists

2) Search

3) Request Information

5) Responsive design: minimalistic design that enhances content on any

screen size rather than compete with it.




IA, Card Sorting

Sketches/Wireframes

Heuristic Reviews

Build


Information Architecture


Wireframes/Sketches


Wireframes/Sketches (mobile)


Visual Design

Preauthorized Contributions (PAC) (Online Banking)

About

With the Bank’s new online pre-authorized contributions (PAC) feature, users can set up

automatic contributions to their Direct Investing, RSP, TFSA, RESP and non-registered

investment accounts, in regular installments throughout the year.

Key User Needs

Easy, step-by-step process of adding, editing a PAC Plan and all related options.

In-built guidance regarding aligning PACs with personal financial goals and KYC profiles.

One-stop management of PAC plans funded from the Bank’s accounts as well as other

financial institutions

Beneficiary management.

Key Business Goals

PAC has traditionally been an in-branch banking feature. The business goal was to translate

this to a self-serve online banking functionality, saving time and resources spent in setting up

and managing PAC plans on behalf of customers.

As with many other online banking tools, make users take control of managing their money –

engaging users and encouraging enrollment

Primary Persona

Chris Roberts, 45,

Insurance Consultant,

MIS Inc., Toronto, ON

“I am on top of my finances – quite involved with self-

managing my money.”

“I do a majority of my banking online.”

Motivation : No dependence on a financial advisor or

branch to manage funding of investments.

Tasks :

- Add new preauthorized contribution plans

- Change funding sources

- Change contribution frequency

- Delete plans

- Add or change beneficiaries

Percentage of use (online banking): 5% (2 hours a week)



The design focused on the following:

1) Integrate logically with current online banking IA – provide clear

navigation entry points: “Account Services” as well as a new “Manage

PAC” link.

2) Provide straightforward task paths/flows with minimal branching.

3) Keep the user focused on the task:

I. Not let the background processes distract the user or interrupt

the flow. Keep the user interaction seamless, even when routing

through external systems.

II. Constantly appraise users regarding system statuses and

present them in an easy-to-follow manner to help them make

decisions rather than distract them.

III. Provide relevant constraints to keep users on track. Remove

any redundant navigation (including primary navigation) when

the user is in one of the process-based flows.

4) Keep terminology, visuals and system feedback consistent across

different flows.




Wireframes

& PrototypesUsability Testing

GUI Specifications

Heuristic Reviews

Build


Process Flow (Add PAC)


Wireframes


GUI Specs

iPhone Mobile App (eLearning)

About

“First Impressions” is an existing eLearning course developed by a

Toronto-based curriculum design & development company. The

course is intended as a quick primer on how to be appropriately

dressed in business settings. The original course was designed for

desktop users. This is a proposed adaption as an iPhone app for

mobile users.

Key User Needs

Quickly access dressing tips before a business meeting or formal

event, while on the move.

Make the best use of a limited wardrobe while travelling.

Adhere to company’s dressing guidelines.

Key Business Goal

Draw mobile users to the customer base

Persona 1

Joe Brown, 28

Sales Representative, Innovo Soft Corp.

Toronto, ON

“I have a predominantly travelling job.”

“I meet with clients frequently in different locations and situations – formal meetings, events,

conferences, etc.”

Motivation : Make the best first impression

Tasks Quickly reference what to wear for an occasion; get guidance on what to pack for

business travel; get information on latest trends; take the quizzes to stay compliant with the

company’s dressing policy

Percentage of use: <5%

_____________________________________________________________________________________________

Persona 2

Karen Smith, 36,

Financial Advisor, XYZ Wealth Management

Toronto, ON

“I regularly meet with high-net-worth clients both in my office and their locations.”

Motivation: To project myself as a successful professional

Tasks: Find information about formal dressing and accessories; reference what to wear when

meeting a particular kind of client, or dressing for an occasion

Percentage of Use: <5%

iPhone Mobile App (eLearning)

Wireframes/Storyboard

Mobile-first Design

About

Atulhanda.com is my personal website. I am transitioning from a

conventional desktop design to a responsive, mobile-first design.

The focus of the new design was to enable users to get information

primarily in a targeted, task-oriented fashion, rather than a “stay-and-

explore” manner.

Analytics show most users come to the site to get specific information

– contact info, resume, quick peek at examples. Also, more and more

users are browsing the site on mobile devices and don’t linger long.

The idea is to let them see what’s available at a glance and quickly

find what they need. Even if they decide to explore, the navigation-

centric design is helpful, especially on mobile devices.

Key Design Concepts

- Responsive, Mobile-first approach

- Task-oriented design

- Navigation is the center-piece of design

- Device-independent user experience

- Both touch and mouse friendly

Wireframes

Mobile-first Design

Visual Design

Android - AV equipment self-check-out app

About

The is an android application meant specifically for a Video

Production group in Arizona State University, USA.

The group maintains an inventory of AV equipment that members

can borrow for different projects. Currently, they use a web-based

application to keep track of inventory and check-outs.

This app is a proposal to make the check-out system available as a

mobile application. The members can track, reserve, check-out and

check-in equipment through their mobile phones. Admins can

additionally add/modify inventory and manage users.

The idea is to decentralize the process and make it convenient for

on-the-go users.

Key Design Concepts

- Design in accordance with user tasks and context of use

- Follow familiar Andriod design and interaction patterns

- Focus on ease of use

Task Analysis

Android - AV equipment self-check-out app

Prototype Screenshots

See prototype online:

http://conceptell.com/protoAVSCO/start.html#p=flow

List: Checked out items Categories List : Alphabetical Item Selection Add/Edit Item Manage Users

http://conceptell.com/protoAVSCO/start.html#p=flow

Date post:	20-May-2018
Category:	Documents
Upload:	lamhanh
View:	215 times
Download:	1 times

Work Samples - conceptell.comconceptell.com/atulweb/assets/resources/Atul_UX-Portfolio.pdf ·...

Documents