Shane Olivo. Selected UX Project Portfolio. Phone

Transcription

1 Selected Location Sydney Phone

2 My primary skills: UX Research UX Design UX Testing Persona Development IA Design Journey Mapping Concept Development Prototyping Skills User Story Development Requirement Prioritisation My secondary skills: Visual Design HTML CSS 02 Skills

3 Discover insights into the problem Develop potential solutions Define the area to focus on Process These four stages, with the addition of pre-project and postproject stages, define my ideal design-led project lifecycle. It considers the divergent (Discover, Develop) and convergent (Define, Deliver) stages of the design process and allows for an iterative loop of designing, prototyping and testing between develop and deliver. Deliver solutions that work 03 Process

4 04 Process

5 Case Studies Digital A&A Portal A portal that brings Deloitte's global value to the fingertips of senior client executives and board members. Users can consume thought leadership, view project information or uncover powerful business insights. Deloitte Private Connect (DPC) Deloitte Private Connect is an online accounting platform for Deloitte Private practitioners and their clients. It consolidates cloud ledgers and assists in managing accounting, bookkeeping and tax engagements online.

6 Digital A&A Project Overview: The end result Portal Challenge How might we increase the accessibility, frequency and quality of audit information, actionable business insights and thought leadership to positively influence client perceptions of Deloitte and increase our value? What I did Scoping & Estimating Lean UX Canvas Creation Persona Development & Stakeholder Ecosystem Competitor Analysis Discovery Interviews User Story Creation & Prioritisation Sketching / Ideation Low-Fidelity + Wireframes & Prototype Usability & Assumption Testing What I did: -Ideation -asdas 06 Digital A&A Portal My Role UX Lead Project Type Concept Development of end to end product Date Feb Apr 2018

7 01 MAKING A PLAN Discover Define Develop Deliver Week 1 Week 2 Week 3 Week 4 Week 5 Week 6 Week 7 Week 8 Week 9+ Pre-project Lean UX Canvas & Persona Workshops Discovery Stakeholder interviews with A&A and Q&R / Customer Interviews / Use Cases Sprint 1 User journeys, Wire Frames & Prototyping, Technology Feasibility Analysis Sprint 2 Iterate designs, User testing & synthesis, Solution Architecture Sprint 3 User testing & High Fidelity Designs, Integration PoCs Sprint 4 Product Prototype, Integration PoCs Phase 2 Showcase Showcase Showcase Showcase Showcase Showcase 07 Digital A&A Portal A project plan helps to set stakeholder expectations. Upon identifying user stories, you can seek to identify what can be fit in the original plan and that becomes your MVP, or you can adapt the plan. Showcases at the end of each sprint help bring stakeholders on the journey.

8 02 VALIDATING OUR PROBLEM UNDERSTANDING Who was involved? Senior and forward thinking stakeholders who understood client needs well How did we do it? As part of a workshop, we completed the canvas as a team through a series of activities What did we learn? Using this we were able to gain mutual understanding of a vision for a portal that would deliver Audit Information, Thought Leadership and Business Insights 08 Digital A&A Portal The lean UX Canvas helps to gain a consistent understanding of the problem among all stakeholders. Further, it allows us to identify the riskiest assumptions we have and test these as we design.

9 03 DEFINING OUR AUDIENCE Target Clients: ASX 100 Companies Primary Client Users: CEO CFO Non-Executive Directors Primary Deloitte Users: Partner Director 09 Digital A&A Portal Having a clear understanding of the audience for the product ensures that functionality and content decisions are made with the right users in mind. It helps when crafting the UX and UI but also when prioritising user stories.

10 04 VISUALISING OUR USERS James - MAIN USER NEEDS & WANTS: Insights about my business (Global and local) Thought leadership relevant to me and why it is relevant to me How is my business doing compared to other companies in my industry and globally? (benchmarking) Is there anything my company can be doing better? What are current trends and industry issues I should be aware of? PAIN POINTS: Bombarded with so much thought leadership that I don t have time to consume it all Doesn t see enough insights or benchmarking You have access to all our data and financial information, how do we compare to other companies? Too many logins to different applications and systems internally and externally annoying to remember and use Role: CFO Age: 51 This tool needs to keep me in the loop with current trends and insights outside the normal audit scope. CHARACTERISTICS: Highly educated Curious personality will seek out trends and information Time poor don t set up time with me unless you have a reason BEHAVIOURS & BELIEFS: Believes that Audit s should turn up additional insights and information given we have access to their information anyway Believes Deloitte should be offering a global perspective on their company and leveraging that Deloitte is a global firm 10 Digital A&A Portal Creating personas brings the target audience to life and provides a point of reflection when making design decisions. When contemplating design options we can always ask, how does this ultimately benefit the primary persona(s).

11 05 UNDERSTANDING USER RELATIONSHIPS Who was involved? Senior and forward thinking stakeholders who understood client needs well What did we learn? We discovered that partners have a very controlled relationship with their senior client stakeholders, which would inform our user permissions. Further, we learnt that there were a number of secondary users who existed in the environment, and provided external sharing capabilities to allow the flow of information to these users. 11 Digital A&A Portal Beyond just understanding who our target audience is, an understanding of their real world relationships and interactions helps to shape roles and responsibilities in the digital product and present relevant content to each user.

12 06 COMPETITOR ANALYSIS What did we learn? Client portals were limited in availability, and where present they were highly operational in nature not strategic like the digital A&A portal. Excluding EY s Canvas tool, competitor products demonstrated poor UX and UI, which when combined with the above meant that the problem space was perfect for a design-led digital solution. 12 Digital A&A Portal Competitor analysis helps understand if the product is differentiated, either in its core product offering or its usability. It can help provide a benchmark or standard to which the digital product needs to beat.

13 07A DISCOVERY INTERVIEWS 13 Digital A&A Portal Explorative research interviews help to validate the problem understanding and define the proposed solution. Insights consistently identified are typically no-brainers, but it s also important to consider the sometimes unique insights from forward thinking individuals.

14 07B DISCOVERY INTERVIEWS Who was involved? We conducted discovery interviews with 11 partners What did we learn? I originally interpreted Audit status to be a primary feature of the tool, but interviews made it clear that while our users may want to know this, it was secondary to all other features and not something of value to them There was a strong need for concise information on current issues and what that meant for our clients that they could pick up and take action off Audit issues are very serious, and needed to be handled via a conversation before they were recorded in the portal Andrew Reid This portal should be Deloitte on steroids, bringing Deloitte s best to our clients [ ] Client exec want to know how to up their game and improve their business, not how their Audit is going. Clients want to know the best information Deloitte has to offer from the heavy hitters and have it curated for them They don t want to know about the Audit or if something is going wrong, they will rely on someone else to resolve that Human interaction should be used to set up the portal and showcase how tailored it is for them As a CFO/CEO they tell the journalists the information appearing in Index Guru, I would rather be able to see the information and news of my competitors 14 Digital A&A Portal Explorative research interviews help to validate the problem understanding and define the proposed solution. Insights consistently identified are typically no-brainers, but it s also important to consider the sometimes unique insights from forward thinking individuals.

15 08 USER STORY CREATION & PRIORITISATION 15 Digital A&A Portal User stories can be made off the back of user story workshops or exploratory interviews and provide a concise listing of product functionality. The MoSCoW method is a way of prioritising which user stories are needed for an MVP build.

16 09 DEFINING THE INFORMATION ARCHITECTURE 1.0 Home 2.0 Audit 3.0 Insights 4.0 Thought Leadership 5.0 <Company Picker> 6.0 Notifications icon 7.0 Account Icon 1.1 Dashboard 2.1 Current 3.1 Current 4.1 Current 5.x <Company x> 6.1 Notifications list 7.1 Account settings 2.2 Archive 3.2 Archive 4.2 Library 7.2 Preferences 4.3 Archived How did we do it? The IA was made after crafting a basic mental model with project stakeholders. Ideally we would conduct a card sort with users, however due to time constraints we were unable to. 16 Digital A&A Portal The information architecture dictates how a user navigates through the product. It should be constructed with a users mental model in mind, and can be co-created using a card-sort and tested using a treejack.

17 10 CONCEPT IDEATION 17 Digital A&A Portal Concept ideation sessions with stakeholders and users help to shape what basic user journeys will be required and illustrates possible paths to achieve them. It also helps uncover questions and points for further testing.

18 11 PAPER PROTOTYPES 18 Digital A&A Portal Paper prototypes are quick to create and quick to test. They allow for feedback on broad concepts and design direction before progressing into the next stage of fidelity.

19 12 CREATING WIREFRAMES 19 Digital A&A Portal Wireframing helps to define visual cues that are not always considered in concept sketches, such as space allocation, prioritisation of content, refined functionality and detailed intended behaviours.

20 13 HIGH FIDELITY DESIGN & PROTOTYPE 20 Digital A&A Portal High-fidelity designs bring the designs to life. Details added at this stage convey information through colour and graphics. Additionally, when paired with Craft + Invision / Zeplin it provides developers the exact CSS specifications they need for development.

21 14A USABILITY & ASSUMPTION TESTING Who was involved? We conducted testing with 11 Deloitte Partners across 2 business units and 5 sectors How did we do it? Testing was embedded in each design sprint, and followed a task driven test plan. Early tests were done as paper prototypes, and later tests were done using Axure / Invision and Silverback. 21 Digital A&A Portal Usability testing informs whether the designs allow users to easily achieve their goals based on qualitative and quantitative data. Assumptions testing verifies that initial assumptions about the product were true or false before having to launch a product in the market.

22 14B USABILITY & ASSUMPTION TESTING What did we learn from testing paper concepts? Horizontal card scrolling was not going to work for our content as it was not scannable, so we changed to a vertical scrolling long card model In order to make content personalised enough for clients, a Deloitte-facing backend would be required that would operate like a CMS What did we learn from testing wireframes? We proposed a data feed of company information on the dashboard, but users were more interested in seeing competitor information Our proposed content hierarchy was wrong, we needed to make insights more prominent, and updates less prominent Our Deloitte-facing portal was not driving enough action from teams, so we provided prompts with likely next actions What did we learn from testing high-fidelity designs? Curated content was not appearing personalised enough, it looked autogenerated. To resolve this we made curated content more closely resemble social media with a from photo and embedded link section Use of colour and size could be applied on the insights graph to indicate opportunity size and risk 22 Digital A&A Portal Usability testing informs whether the designs allow users to easily achieve their goals based on qualitative and quantitative data. Assumptions testing verifies that initial assumptions about the product were true or false before having to launch a product in the market.

23 15 FEATURE BACKLOG 23 Digital A&A Portal By the end of a design project, there is likely to have been new use cases identified and use cases that were originally prioritised out. A feature backlog helps teams keep track of this and consider them in future phases.

24 16 PROJECT OUTCOME What I did well Embedded user testing in each sprint provided powerful insights throughout the entire design process Creation of user stories from the discovery interviews provided a much wider arrays of use cases than typically identified in standalone workshops Including Dev team in standups to ensure a realistic solution was being developed What I would do differently Extended time in the wireframing stage would ve meant more insights could ve been implemented and tested in designs rather than just being added to the backlog User testing with actual users (not partners) would have surfaced more accurate feedback, particularly when testing assumptions Next Steps This high-fidelity prototype will be tested with real clients If the feedback is positive it will be taken into build After The MVP build the feature backlog will be designed / built out 24 Digital A&A Portal At the end of each project a retro should be performed to identify what worked well, what could ve been better and what the next steps (if any) are. This helps build a pattern of continual improvement in the design process.

25 Case Studies Digital A&A Portal A portal that brings Deloitte's global value to the fingertips of senior client executives and board members. Users can consume thought leadership, view project information or uncover powerful business insights. Deloitte Private Connect (DPC) Deloitte Private Connect is an online accounting platform for Deloitte Private practitioners and their clients. It consolidates cloud ledgers and assists in managing accounting, bookkeeping and tax engagements online.

26 DPC Document Project Overview: The end result Management Challenge How might we enhance practitioners productivity and maximise their client engagement efficiency? What I did Scoping & Estimating Lean UX Canvas Creation Competitor Analysis User Story Creation Sketching / Ideation Low-Fidelity + Wireframes & Prototype Visual Design What I did: -Ideation -asdas 26 DPC Document Management My Role Design Lead Project Type Design & Build of a product enhancement Date Oct Dec 2018

27 What is the Practitioner Portal? What does it do? Manages the work being performed by practitioners for clients What features does it have? Task / Service workflow tracking Team management & user access controls Client information and messaging Notifications of work due / client requests Document Management Digital signing of documents External application integration Overview of services See the status of services being delivered to clients Overview of client groups Manage services by client groups Overview of tasks See task status and workload at a glance 27 DPC Document Management

28 Areas of connect I ve worked on Docusign integration to support Digital Signatures Team Management Dropbox integration to support document storage Help centre & Help Widget Online invoice payments 28 DPC Document Management

29 01 MAKING A PLAN Discover Define Develop Deliver Week 1 Week 2 Week 3 Week 4 Week 5 Pre-project Lean UX Canvas & planning workshops Sprint 1 User story workshops & concept ideation Sprint 2 User journeys, Wire Frames & Prototyping, Usability Testing Sprint 3 Completion of user journeys & high fidelity design Build & Design Phase 2 29 DPC Document Management A project plan helps to set stakeholder expectations. Upon identifying user stories, you can seek to identify what can be fit in the original plan and that becomes your MVP, or you can adapt the plan. Showcases at the end of each sprint help bring stakeholders on the journey.

30 02 VALIDATING OUR PROBLEM UNDERSTANDING Who was involved? The project team and 2 practitioner leaders who would be users How did we do it? In a workshop we contemplated the canvas as a group What we learnt? Using this we were able to develop a mutual understanding of what the problem we are solving is what would be required in the tool to fix this problem 30 DPC Document Management The lean UX Canvas helps to gain a consistent understanding of the problem among all stakeholders. Further, it allows us to identify the riskiest assumptions we have and test these as we design.

31 03 GATHERING REQUIREMENTS Who was involved? Senior and forward thinking stakeholders who understood client needs well How did we do it? As part of a workshop, we completed the canvas as a team through a series of activities What we learnt? Using this we were able to gain mutual understanding of a vision for a portal that would deliver Audit Information, Thought Leadership and Business Insights 31 DPC Document Management Brainstorming of user stories can be done with or without triggers, or themes, for users to consider. It helps everyone in the room have a voice and promotes efficient gathering of ideas.

32 04 LOW FIDELITY DESIGNS 32 DPC Document Management Wireframing helps to define visual cues that are not always considered in concept sketches, such as space allocation, prioritisation of content, refined functionality and detailed intended behaviours.

33 05 HIGH FIDELITY DESIGN 33 DPC Document Management High-fidelity designs bring the designs to life. Details added at this stage convey information through colour and graphics. Additionally, when paired with Craft + Invision / Zeplin it provides developers the exact CSS specifications they need for development.

34 06 PROJECT OUTCOME What I did well Designing out low fidelity screens as user flows meant at a glance any stakeholder could get an understanding of the project and the designed functionality Keeping developers involved early meant that the designs were realistic to build in the tight timeframes sought out by project leaders. What I would do differently Ideally we would have completed some form of user testing at each stage of fidelity, but we were unable to due to time and budget constraints and instead just used user feedback workshops Delivering a visual feature backlog to stakeholders could have kept momentum strong for future sprints Next Steps The remaining functionality from low-fidelity designs will be built into high fidelity alongside development of the existing designs The document request and fulfilment process will be scoped and designed 34 DPC Document Management At the end of each project a retro should be performed to identify what worked well, what could ve been better and what the next steps (if any) are. This helps build a pattern of continual improvement in the design process.