user experience design portfolio

17
1 Portfolio Jeppe Stig Hansen A Senior User Experience Designer with: Strong process skills within ideation, ux process and planning Holistic approach and capable of involving all target audience and stakeholders in my deliverables Create completely intuitive solutions out of complex concepts and challenges Have a original and true interest in the users understanding and perception Capable of take the 3 steps back and see the bigger perspective from the concept point of view – before we dive into the details about how to build it concrete. Extraordinary emphatically skills in work with users, co-work, developers, customers and stakeholders. The purpose of this portfolio is to demonstrate the variety of my UX deliverables, the different kinds of customers I have worked with, how I solved specific UX challenges and my role in the projects.

Upload: jeppe-hansen

Post on 31-Mar-2016

219 views

Category:

Documents


3 download

DESCRIPTION

Featured User Experience Designs from my career. - Description of the type of task my approach - Deliveries - Feedback - UX challenges - How I solved them.

TRANSCRIPT

1

Portfolio Jeppe Stig Hansen

A Senior User Experience Designer with:

• Strong process skills within ideation, ux process and planning

• Holistic approach and capable of involving all target audience and stakeholders in my deliverables

• Create completely intuitive solutions out of complex concepts and challenges

• Have a original and true interest in the users understanding and perception

• Capable of take the 3 steps back and see the bigger perspective from the concept point of view –

before we dive into the details about how to build it concrete.

• Extraordinary emphatically skills in work with users, co-work, developers, customers and

stakeholders.

The purpose of this portfolio is to demonstrate the variety of my UX deliverables, the different kinds of

customers I have worked with, how I solved specific UX challenges and my role in the projects.

New process tool on Ofir.dk

www.ofir.dk (release planned after summer)

Task:

– Develop a tool for jobseekers to aid them in the process of seeking job.

– A new to market system that does not yet exists.

– The UX project alone is estimated to 6 months: November 2014 to April 2015

2

Portfolio Jeppe Stig Hansen

New to marked job seeking process tool

Ofir A/S

Role:

- Project manage UX and design process

- Facilitate ideation workshop

- Develop concepts

- Manage and plan UX process

- Manage design proces

Inspiration:

- AirBnB

- Trello process tool

My Deliverables:

- Ideation summery catalogue

- Concept specification

- Personas

- Task models

- User Flow models

- IA

- Responsive wireframes aligned to Bootstrap grids (from large desktop to mobile) In version 27 in wireframes at the current moment.

New design on Ofir.dk

www.ofir.dk (release planned before summer)

Task

– New design and optimized usability on Ofir.dk

My Approach

1. Gather user insights through interviews.

2. Perform creative workshops.

3. Create concept

4. Build personas, task models, user journeys

5. Wireframes and IA

6. Document, specify and hand over to designer

My Deliveries

– Workshops summery

– Concept

– Wireframes

– IA

Feedback

– The business is very pleased with the new style and look and feel of the website.

3

Portfolio Jeppe Stig Hansen

New Ofir.dk

Ofir A/S

4

Portfolio Jeppe Stig Hansen

New Ofir.dk

Ofir A/S User Experience Challenge

– Update the design to a modern design, cut the functionality to the

bone

Role:

- Project manage UX and design process

- Facilitate ideation workshop

- Develop concepts

- Manage and plan UX process

- Manage design proces

My Deliverables:

- Ideation summery catalogue

- Concept specification

- Personas

- Task models

- User Flow models

- IA

- Responsive wireframes aligned to Bootstrap grids (from large desktop to mobile)

5

Portfolio Jeppe Stig Hansen

4 personas

Ofir A/SChallenge:

Develop personas that are more usable than the usual rich text personas.

This way of setting up the personas has the advantages of:

• Short concise description

• Way more operational how to work with them

• Easier to how to communicate with them

• Overview of the 5 topics that in bullets outlines the

– Needs

– Drivers,

– Interests

– How to reach the personas

– What the company must never do.

Personas are used as the constant validator of:

• Task models

• User journeys

• User flow

• IA

• Wireframes

Used for the new Ofir.dk and new process tool for Ofir.dk (former 3 pages in this portfolio)

Ofir.dks’ primary e-commerce site

https://rekruttering.ofir.dk/arbejdsgiver/indryk-

annonce/vaelg-medier

Task

– Optimize Ofir.dks’ primary e-commerce site to increase the conversion rate

My Approach

1. Gather user insights through focus groups, user tests, videos of users.

2. Research in depth the users perception of preserved value of products

3. Build wireframe concept of new e-commerce site

4. Run 4 iterations of user tests and corrections

5. Document, specify and hand over to designer

My Deliveries

– One prototype of an optimized e-commerce site that hits the business goals 100 % and enables the user to get a complete overview of pricing table – in a nice, and calm site.

– A documentation and specification of the site that enables developers to start on the project right away

Feedback

– Both the business and the users claim the new page to be a way better presentation of a rather complex e-commerce site.

6

Portfolio Jeppe Stig Hansen

Optimizing e-commerce site

Ofir A/S

No overview that enables the user to compare the products

All requested information available

No information available about the product s

User must scroll to see all content of a product and to get to the buy button

User Experience Challenge

– Optimize a complex e-commerce site and include further information

without making the page a mess and confuse the user as well as

optimizing the conversion rate .

– More then 20 requirements merged into one intuitive solution

Wireframe – spot management page

Easy overview of the pricing table 7

Portfolio Jeppe Stig Hansen

Existing e-commerce site Optimized e-commerce site

Optimizing e-commerce site

Ofir A/S

www.Leadertrial.com (requires login)Task

– Make it intuitive to manage an online corporative working system for physicians all over the world.

My Approach

1. Get complete overview of system features and tasks

2. Get information about the user needs and level of it-expertise trough workshop

3. Specify feature gross list trough workshop

4. Write requirement specification

5. Specify Information Architecture

6. Develop Wireframes

7. Brief and approval of design

My Deliveries

– Feature definition

– Requirement specification

– Wireframes and Information Architecture

Feedback

– The new system is such a success and intuitive to use that the local managers do not need education and give satisfied feedback about the system.

8

Portfolio Jeppe Stig Hansen

Optimize corporative work system

Novo Nordisk

Wireframe – User management page

Final design - User management pageOverview of all users and user management in same window

List of users that can be bulk managed and filtered

Visual overview of all user credentials

User Experience Challenge

– Make it intuitive to manage an online corporative working system

for physicians all over the world.

9

Portfolio Jeppe Stig Hansen

Optimize corporative work system

Novo Nordisk

iPad App for patients

Task

– Create Ipad app for patients with Multiple Sclerosis

My Approach

1. Focus group interview with patients to uncover wishes to how to kill the 6 hours

2. Create Personas based on focus group

3. Map user needs and costumer needs

4. Specify Information Architecture

5. Develop wireframes

6. Test on patients

My Deliveries

– Focus group interview findings

– Personas

– Requirement specification

– Site map

– Wireframes

Feedback

– Patients and nurses have given feedback so positive about the iPad app that the study that started as a local Danish pilot project has been rolled out all across Europe.

iPad App for patients and nurses

10

Portfolio Jeppe Stig Hansen

Novartis

User Experience Challenge– Create an app for people with very special decease related need

and for nurses. Create an app that the patients wish to use during an 6 hour waiting on a hospital.

– People with Multiple Scleroses has often problems with shaking hands, bad sight and problems concentrating

Wireframe iPad App

Menu with large buttons makes it easy to hit the buttons

Large font makes it easy to read.

Lots of white space minimizes the distraction of the user

Final Design iPad App

11

Portfolio Jeppe Stig Hansen

iPad App for patients and nurses

Novartis

www.NovoNordisk.com / Patients Task

– Information Architecture and wireframes for www.novonordisk.com

My Approach

1. Card sorting workshops with key stakeholders at Novo Nordisk

2. Card sorting workshop with Novo Nordisk patient sounding board

3. Consolidate workshop findings and propose new sitemap

4. Draw wireframes for new Patient Overview and Section page

My Deliveries

– Workshop findings

– New sitemap

– Wireframes

– Search Engine Optimization of pages

Feedback

– No Feedback

Re-structuring content of

Novo Nordisk’ corporate website

12

Portfolio Jeppe Stig Hansen

Novo Nordisk

User Experience Challenge

– Make content and page / menu labelling more approachable and visible for users

Card Sorting Workshop Outcome - sitemap

Large brown paper sitemaps where participants of the workshop order labels reflecting the sitemap.

Final Design – section page

Wireframes – Section page

More patient centred approach visualize content of the section

New labels makes it easier to understand the content of a page

13

Portfolio Jeppe Stig Hansen

Re-structuring content of

Novo Nordisk’ corporate website

Novo Nordisk

GlobeShare.NovoNordisk.com Task

1. Create an overview page of all Novo Nordisk’s devices for their SharePoint intranet

2. Align structure, page types and design for all devices on Novo Nordisk GlobeShare intranet

My Approach

1. Card sorting workshop with all Global Brand Managers

2. Page structure workshop with all Global Brand Managers

3. Consolidate workshop outcome into general sitemap and wireframes

4. Presentation of sitemap and wireframes to Global Brand Managers

My Deliveries

– Workshop findings

– New sitemap

– Wireframes for overview page

– Wireframes for 3 page types for Global Brand pages

Feedback

– No Feedback

Align multiple portals on large SharePoint

solution for all Novo Nordisk employees

14

Portfolio Jeppe Stig Hansen

Novo Nordisk

Wireframe – Device Overview PageFinal design – Device overview page

Overview of all devices

Video presentation of each device makes it easy to get an overview of pros and cons of each device

Spots feeds latest information from each device site highlights activity on brand pages and reuse information and minimise maintenance

User Experience Challenge

– Device sites that requires a minimum of maintenance

– Overview page that present the relevant information for internal

use

Wireframe – Device Front Page

News module reflecting latest news, and updates. Also feeds to the design overview page

Presentation of brand –video or HTML5 / Java Script illustration

Menu reflecting the consolidated sitemap

15

Portfolio Jeppe Stig Hansen

Align multiple portals on large SharePoint

solution for all Novo Nordisk employees

Novo Nordisk

iPhone App Task

– Develop an iPhone App to support a complex internal process framework

My Approach

1. Get complete understanding of process framework through literature and workshop

2. Create Information Architecture

3. Flow Diagram

4. Create wireframes

My Deliveries

– Information Architecture

– Wireframes

Feedback

– No Feedback

iPhone App as tool for assisting

complex process framework

16

Portfolio Jeppe Stig Hansen ISS Facility Service

Flow DiagramFinal design

Flow diagram ensures a logic user flow and keeps the overview of the functionality

User Experience Challenge

– Create a iPhone App that proves an overview of a very complex

process

Wireframe – iPhone App

The top of the app lets the user get the overview

Swipe makes it easy for the user to get the overview of the process framework

The centre shows the detail

17

Portfolio Jeppe Stig Hansen

iPhone App as tool for assisting

complex process framework

ISS Facility Service