christopher mccann ux portfolio 2016

31
Hello. Some recent work and thoughts by Christopher McCann

Upload: christopher-mccann

Post on 15-Apr-2017

28 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Christopher McCann UX Portfolio  2016

Hello. Some recent work and thoughts by Christopher McCann

Page 2: Christopher McCann UX Portfolio  2016

Christopher McCann [email protected]@letterpress_se+46 70 629 5772

Some clients

Page 3: Christopher McCann UX Portfolio  2016

Understanding the people that use the system through observation.

Identifying and organising information within a product or system in a purposeful or meaningful way. system

Design the interactive behaviours of a product or service with a focus on their use.

Competence Areas

Design leaders drive change through design principles using communication, empowerment and vision.

Design of a digital product considers how a product is used, functions needed and how it can be realised.

Facilitate groups, in co-design workshops that yield new ideas through different knowledge, goals and perspectives.

DESIGN LEADERSHIP

PRODUCT DESIGN FACILITATION

USER RESEARCH

INFORMATION ARCHITECTURE

INTERACTION DESIGN

Page 4: Christopher McCann UX Portfolio  2016

A Process

FRAME PROBLEM

ENVISIONSOLUTION

UNDERSTAND USERSVALIDATE

Who are the users and what are their

needs?

Identify how they solve their problems

today?

Understand Users

Test our ideas and designs. Repeat.

Validate

Consider multiple ideas.

Build on other ideas

Envision Solution

Identify expected outcomes of the solution.

Frame the Problem This is a process that I use both in my design work as well as a communication tool with stakeholders. I emphasise the

importance of collaboration, user research and iteration in the process.

Page 5: Christopher McCann UX Portfolio  2016

Bergh’s School of Communication

UX Product Development

Program teaches students how to develop products based on a User Centered methodologies. Course divided into three main sections - Discover, Create and Validate.

Lecturer for the Create section of the Program.

Day long section teaches methods for the development of product needs and ideas into concrete designs that can be validated or implemented.

DESIGN LEADERSHIP

INTERACTION DESIGN FACILITATION

Page 6: Christopher McCann UX Portfolio  2016

EpiServer AB

Episerver Commerce allows Marketers to manage e-commerce websites by integrating content and digital marketing capabilities. Product is made up of three key functions - Catalog Management, Promotions and Customer Service. Commerce has a very close user integration with our CMS system. The product was acquired by Episerver in 2012 and needed to be completely redesigned to improve usability and maintain consistent UX across the Episerver platform.

Interaction Design Facilitation User

Research

Page 7: Christopher McCann UX Portfolio  2016

EpiServer ABUX Designer - Commerce

Complete redesign of Catalog Management and Discount Management functionality.

Responsible for design during all stages of product development - sketch, prototype to final product.

High level of UX collaboration with 14 person team in an Agile software development environment.

Conduct continuous user research for Commerce development.

FACILITATIONINTERACTION DESIGN

USER RESEARCH

Page 8: Christopher McCann UX Portfolio  2016

EpiServer ABFACILITATIONINTERACTION DESIGN

Commerce - Catalog Management

USER RESEARCH

Design of information flows, user scenarios and graphical interface for entire

Catalog Management section.

Existing Catalog Management - dated and very poor usability

Page 9: Christopher McCann UX Portfolio  2016

EpiServer ABCommerce - Campaigns and Discounts

FACILITATIONINTERACTION DESIGN

USER RESEARCH

Prototype developed through iterative sketching and User Research.

Existing Discount Management - dated and

very poor usability.

Page 10: Christopher McCann UX Portfolio  2016

EpiServer ABUX Team Lead

Lead group of 7 persons made up of UX Designers, Content Specialists and Front End developers.

Team is responsible for maintaining consistent UX across entire Episerver platform including 8 products developed in 3 countries.

Responsible for communicating the value and vision of UX within organisation.

Implemented a number of collaborative UX processes: Design Studio, Outcome Mapping and Story Mapping

DESIGN LEADERSHIP

Page 11: Christopher McCann UX Portfolio  2016

EpiServer ABMy UX leadership goals

Transparency - communicate in an honest and straightforward way.

Patience - accept that fact that good design takes time.

Flexibility - Treat people as intelligent and self-motivated. Emphasising individual’s strengths not penalising weaknesses.

Learning as a team - ‘No of us are as smart as all of us’

Humble - willingness to admit mistakes and ask for help. Accepting the fact that I cannot have all the answers.

DESIGN LEADERSHIP

Page 12: Christopher McCann UX Portfolio  2016

UX Team Lead - Collaborative Design

Outcome Mapping

A method of framing the problem around the desired outcomes.

Design Studio

A way to generate many ideas and solutions to a problem quickly through sketching, iteration, and critique.

Story Mapping

The use of a story to describe how a user would interact with a product and the technical details needed to realise such a solution.

EpiServer ABFACILITATION DESIGN LEADERSHIP

Page 13: Christopher McCann UX Portfolio  2016

EpiServer ABUX Team Lead - UX Standards UX Front End Guidelines

DESIGN LEADERSHIP

As the company expanded to development groups located outside of

Stockholm, it became challenging to maintain UX quality. A style-guide was created to document basic interface

elements and patterns. This is proven to save considerable time and improve

overall UX quality.

Page 14: Christopher McCann UX Portfolio  2016

Ericsson Dashboard

-7,4

42

-1,5

17

-1,1

64

-4,5

77

-3,2

53

-3,6

01

0

-1,8

33

-2,4

85

-10,

653

-3,1

03

-1,9

19

4,66

7

-3,0

91

-715

-2,0

58

-673

-4,7

21

-5,2

99

-8,0

31

-12,000

-10,000

-8,000

-6,000

-4,000

-2,000

0

2,000

4,000

6,000 GF MANAGEMENT INTERNAL COMMUNICATIONS INVESTOR & ANALYST RELATIONS PUBLIC AND MEDIA RELATIONS COMMUNICATIONS IT MARKETING COMMUNICATIONS BRAND MANAGEMENT (1332) BRAND MANAGEMENT COMMUNICATIONS OPERATIONS EDITORIAL (JGC)

KS

EK

GF Communication 2011 TOTAL EXPENSES per Cost Centre

FEB BUDGET

Reporting

Monthly summary CC result

YTD

Forecast YTD vs. Plan

Previous year YTD

YTD vs. FY Plan

Unique'#'

Information Structure

Unit B

Unit A2 Unit A1 Unit A3

CC 1 CC 2 CC 3

Category Month,1 Month,2..

Direct,Expenses

Alloca9on

Internal

+,Projects

=Gross,Expenses

@,Revenue

=,Net,Expenses

Number,of,Employees

Number,of,Consultants

Group Functions

CFO

Financial Control (DEC )

Ericsson Credit AB

Security (DEA)

Treasury

F&A,PM,GM 1) Roland Hagman

Efficiency

Other Common costs

" F I N A N C E "

CEO

Strategy

Communications (DI)

Sales & Marketing (DS )

HR & Organization (DK)

Legal Affairs (DJ)

T Technology & Portfolio Mgmnt

Ericsson Mobile Money Services

Excl EMM

Common functions - Real estate (DEW )

IS/IT Common functions - IS/IT

Common functions - Sourcing

Control and Compliance (DEB)

VOR Ericsson Racing Team,

Reporting

Monthly summary CC result

YTD

Forecast YTD vs. Plan

Previous year YTD

YTD vs. FY Plan

Problem

Approach

Ericsson corporate finance wanted to increase the effectiveness of communicating key financial information across operations worldwide.

A new concept for information modelling and reporting was developed. Initial workshop to understand relevant financial reporting and desired outcomes of new financial reporting. Overall prioritisation of information based on importance and frequency of use

Iterative concept development of alternative information presentation methods from sketch to hi-fi wireframes.

INTERACTION DESIGN

Existing reporting was done through a series of excel spreadsheets. Communication of key

elements could be improved. Relevant cost information was modelled and

validated with customer.

Page 15: Christopher McCann UX Portfolio  2016

Ericsson DashboardDesign Guidelines:

Incorporate Ericsson visual brand guidelines.

Identify and highlight key financial figures.

Express financial relationships graphically.

Improve readability and remove excess visual clutter.

INTERACTION DESIGN

Page 16: Christopher McCann UX Portfolio  2016

Företagarna.se

Problem

Approach

The membership organisation, Företagarna.se, wished to attract a new member base and needed to develop their digital presence. Their goal was to attract a younger, entrepreneurial and more culturally diverse group than their existing membership base, and the new design should reflect this.

Research - Determine what competitors’ members consider with this type of membership organisation. Effect Mapping - Identify overall desired effect of website and target groups. Develop Personas and new concept for website. Conceptual Lo-fi and Hi- fi Wireframes

INTERACTION DESIGN FACILITATION

Page 17: Christopher McCann UX Portfolio  2016

Företagarna.seFACILITATION

Facilitating Impact Mapping workshop with stakeholders for Företagarna.

Identification of target group stakeholders for Företagarna.se

Initial ideas of desired outcomes of website.

Development of desired effect of the website

Page 18: Christopher McCann UX Portfolio  2016

Nytta med Webbplatsen

•  Grundläggande information om företagande Hur startar jag ett företag? Ta del av fallstudier och intressanta affärsidéer, få stöd och guidelines.

•  Information om medlemskap / pris Se pris, lätt att bli medlem, samt förstå nyttan med medlemsskap, vilka förmåner man får etc.

•  Nätverka med andra Diskutera med andra kring frågor som rör att starta företag.

•  Vilka är Företagarna Förstå vilka frågor driver Företagarna driver och vilken nytta de ger mig som ny företagare?

Blivande medlem - Ny företagare

’Karin’

Nytta med Webbplatsen •  Hämta Information

•  Rapporter /Remisser

•  Statistik •  Nyheter

•  Kalendarium •  Bilder

•  Kunskap om företagande Hur är det att driva ett företag, fallstudier mm.

•  Kontaktuppgifter Vad händer i mitt området? Kontaktuppgifter. Lokala nyheter. Utländsk kontakter.

•  Omvärldsbevakning kring politiska frågor Vilka frågor driver Företagarna och hur? Vilka är de aktuella frågorna inom näringspolitik och lagstiftning?

Politiker/Journalist/

Makthavare

’Jonas’

Företagarna.seFACILITATION

Two of five personas developed to describe the target groups of the website.

Page 19: Christopher McCann UX Portfolio  2016

Företagarna | START

!"

STARTSIDANLevande startsida En huvudpuff med rullande bildspel. Baserad på ”testimonials” – t.ex. Möt Anna, nybliven medlem, och läs varför hon valde att gå med. Tonen är trygg, personlig, positiv.

5 GODA SKÄL ATT BLI MEDLEMExempel på puffar:

1. Tycker du att juridiken är krånglig? Vi förklarar och ger dig goda råd.2. Alla våra medlemmar får gratis juridisk experthjälp3. Jag sparade in hela medlemsavgiften när jag köpte en ny bil, och jag tankar billigt på OKQ8.4. Vi ger dig goda råd i exempelvis personalfrågorna - Anställningsvillkoren - Sjuklöneansvaret - Uppsägningar5. Gratis försäkring i 3 månader för nya medlemmar. Du får: - Sjukvårdsförsäkring - Livförsäkring - Olycksfallsförsäkring

Företagarvänliga förslag från Miljöpartiet!"#!$%&'(#)*+&,-&'+#.#/01#2344#5,#44623

Miljöpartiet vill underlätta för småföretagen att expandera och nyan-ställa, bland annat genom att avskaffa sjuklönekostnaden för företag med upp till tio anställda. Det skriver Maria Wetterstrand och Mikaela Valtersson i en debattartikel i SvD.

Företagarvänliga förslag från Miljöpartiet!"#!$%&'(#)*+&,-&'+#.#/01#2344#5,#44623

Miljöpartiet vill underlätta för småföretagen att expandera och nyan-ställa, bland annat genom att avskaffa sjuklönekostnaden för företag med upp till tio anställda. Det skriver Maria Wetterstrand och Mikaela

Tipsa artikeln Kommentera

Vi på Företagarna är engagerade i ditt företag. Vi vill att du ska ha det så bra som möjligt och slippa krånglig byråkrati och skyhöga skatter. Vi vill att det ska vara enkelt att starta, driva, utveckla och äga företag i Sverige. Är du engagerad i ditt företag? Gör som 70 000 andra företagare. Bli medlem i Företagarna.

Våra 3 viktigaste frågor just nu

– Lägre skattetryck

– Flexiblare arbetsmarknad

– Enklare regler

Vad har vi uppnått och vad vill vi förändra? Läs mer om grönt, gult eller rött ljus.

7*$8058###9###:'&((##9###)';+*'#<#("0'##9##

!"#$%&#'(')*$')+(,*$#)+&+$-$&+.%'+)%-.

!"#$"%%%%%%%%&'(%)*+'*)%%%%%%%%%,#+%(-./$0%%%%%%%%,#+%.1$%,(0%%%%%%%%,#$%2(--!%,(0%

-345657 $899:7657 (%;5<=8

Det här får du!

>?@?<9?AA

5 goda skäl att bli medlem

(bildspel)

Sök

!"

Hej! Vill du prata med oss?Ring, mejla eller chatta.

Vi hörs!

#"

$"

Ditt postnummer

��� �����������

!1B

!"

#"

$"

!8;87C56D987657D975D5E6578D%;5<%F:GG:7%:H4%97=DI

J8;98EK

BESKRIVNING OM FÖRETAGARNAKort beskrivning om företagarna som ger den potentiella medlemmen argument för att gå med och förståelse för vad Företagarna är för något. Rakt på sak, men samtidigt en trev-lig ton.� 7��5��!.6'�-!*�,5��6-!/�#�-*�.�.% ��;1%�4-��-��"6-� Sveriges företagarklimat”� 7��! '4*.(��; !/�'�*�1�-��.15-/� 4-0/!��)!*�1%�<**.� här för dig”. � 7��-0,,/%(($6-%#$!/�; !/�4-��4./��//�#6-��.+)��((���* -�;�

NYHETERNyheter, rapporter och press i en sorterad ordning. Tydligare presenterad.

Förslag för framtidenRubriker. Fundera på vad nuvarande/potentiella medlemmar sö-ker efter när de har problem, frågor osv., försök att använda de-ras vokabulär. Att använda rätt rubriker är ett sätt att hamna högt på Google. Etiketter, nyckelord. Här kan Företagarna använda sig �1�)!-�.,!�%<'�1+'��0(4-��/�!2���6#'+./*� ..'3 ���&0'(6*!'+./-nad, Försäkringskassan, Lagar och regler, Hälsa (men inte enbart Lagar och regler, Hälsa). I förlängningen kan man också ha ett s.k. taggmoln, där besökarna kan hitta de populäraste ämnena.

B8;98EK9?AA%

”Ensam är man inte stark” Bli medlem för

990 kr=#>'?#';%+?"$?$+

Företagarna.seINTERACTION DESIGN

Conceptual wireframe for startpage of Företagarna.se.

Art Direction proposal of startpage.

Page 20: Christopher McCann UX Portfolio  2016

Problem

Approach

Determine if the existing content from Ericsson global intranet can be adapted to a new conceptual design for intranet. New design was to be part of global relaunch in 2012.

Conduct content survey of existing information architecture on present intranet. Map content migration to proposed new information architecture. Determine if content needs to be modified, moved or redesigned for the new design. Redesign information architecture.

Ericsson Intranet IAINFORMATION ARCHITECTURE

Page 21: Christopher McCann UX Portfolio  2016

Ericsson Intranet IAINFORMATION ARCHITECTURE

Page 22: Christopher McCann UX Portfolio  2016

Problem

Sverigeflyg is a domestic low-cost airline that operates out of Bromma airport. Destinations are Göteborg, Kalmar, Malmö. The company is entirely on-line with no physical facilities. They wished to modernise and streamline the booking process based on the following goals:

Shorten overall booking process. Introduce the ‘ticket stub’ concept to the process. Improve the conversion rate of passengers that begin the process to payment. Improve the overall understanding and transparency of the process.

Interview with Customer Service representatives to identify pain-points. Concept was developed collaboratively with client/developer. Final Prototype was delivered to developers for implementation.

Approach

Research Sketch Concept Prototype

Sverigeflyg.seINTERACTION DESIGN

Page 23: Christopher McCann UX Portfolio  2016

Sverigeflyg.seINTERACTION DESIGN

Prototype created using Axure

Sketching ideas - interface options and information flow.

Page 24: Christopher McCann UX Portfolio  2016

KTH Digital Workplace

Problem

Approach

As part of a larger IT strategy, the KTH IT department wished to get a better understanding of the digital workplace for KTH all users - students, faculty and administrative functions. Over forty user interviews were conducted in 2012 resulting in a set of seven personas as well as a tactical strategy for the near future.

Develop interview guidelines and script. Conduct (30) interviews Document groupings, patterns and begin formulating personas. Refine full personas, develop method for how personas can be maintained in future.

USER RESEARCH

Page 25: Christopher McCann UX Portfolio  2016

KTH Digital WorkplaceUSER RESEARCH

Page 26: Christopher McCann UX Portfolio  2016

Svenska Spel Mobile User Test

Background

Svenska Spel was in the process of launching a new Triss Lottery app. As a part of the design process, they wanted to conduct end-user tests to get some feedback regarding overall usability, information flows and design. Two Iphone prototypes were tested as well as some design sketches on paper. Eight users we tested in Stockholm in 2011.

ApproachTogether with client identify relevant task scenarios to test App. Recruit, conduct and document (25) user tests - video and audio. Analyze results, providing visual presentation and interaction design improvements.

USER RESEARCH

Page 27: Christopher McCann UX Portfolio  2016

Svenska Spel Mobile User Test

USER RESEARCH

Page 28: Christopher McCann UX Portfolio  2016

Scania Trucks Dashboard User Test

Background

Approach

Scania Trucks is a large manufacturer that was in the development process for an Instrument Cluster to be used on all vehicles sold worldwide. As part of the product development process, they wished to integrate user testing into the initial stages of design. A digital prototype was tested using Stockholm city bus drivers to get feedback on the usability of the Cluster as well as to understand the drivers environment, needs and desires.

Identify overall target effect improvements of new dashboard. Identify relevant task scenarios for test persons. Conduct and document user tests (8) - video and audio. Analyze results, providing visual presentation and interaction design improvements.

USER RESEARCH

Page 29: Christopher McCann UX Portfolio  2016

Resultat, ICL Ger den relevant information vid rätt tillfälle?

De flesta tycker det är bra med

klocka och temp inuti mätaren.

3/6 känner sig osäkra på AE är och vilken växel

som är i.

Stoppknappen är för liten, speciellt

vid starkt ljus tycker de flesta.

3/6 tycker det är irrelevant info för

dem.

4/6 tycker att bromstryck,

hastighetsmätare och stoppknapp är den viktigaste

ICL-informationen.

Resultat, menyer

Alla förstår vilka funktioner som

menyerna innehåller.

Hälften känner osäkerhet om värdet av en viss mätpunkt

bland de olika menyerna är bra eller

dåligt.

Scania Trucks Dashboard User Test

USER RESEARCH

Summary of which functions that worked well and those that did not.

Page 30: Christopher McCann UX Portfolio  2016

Resultat, vilka funktioner är relevanta?

Siffrorna visar hur många av de 6 testpersoner som tycker en funktion är viktig, neutral eller oviktig för dem när de kör.

Visa funktioner tycker TP är oviktigt fast de tar stor plats i ICL.

Scania Trucks Dashboard User Test

USER RESEARCH

Table summarises which dashboard functions were considered important for bus drivers. These results differed substantially to Scania’s understanding of

the need for different features.

Page 31: Christopher McCann UX Portfolio  2016

“Do not fear mistakes - there are none. ” ― Miles Davis