documentxd

19

Click here to load reader

Upload: mohan-balaji

Post on 13-Apr-2017

160 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: DocumentXD

3D ProcessDiscover | Design | Deliver

APPROACH

Page 2: DocumentXD

DiscoverUser Goals

Business Model

SWOT Report

Ideation

Story Board

Product Vision Video

Collaboration SME

Business Analyst Sketch Artist / Visual Designer

Project Manager

Page 3: DocumentXD

DesignUser Flow

Lo-Fi Wireframes

Hi-Fi Wireframes

Visual Detailing

Rapid Prototyping (URL)

Usability Plan & Script

Session Recording

Collaboration Business Analyst Visual Designer

UI Developer Project Manager

Page 4: DocumentXD

DeliverAssets

Styleguide

Functional Specification

Collaboration Business Analyst Visual Designer

UI Developer Project Manager

Page 5: DocumentXD

Appendix

Page 6: DocumentXD

The story. Background explanation of the problem and goal. A list or statement of what everyone agrees will exist when this one story is done. Note, this is a list of what to do, not how to do it. 

Seed This will serve as a working document that assists in brainstorming potential goals with the customer and team members.

Video Interview - 30 Mins, or based on clients interest. (Optional)

GROW Model

Goal - What is the end point, where the client wants to be.

Reality - The Current Reality is where the client is now. What are the issues, the challenges, how far are they away from their goal?

Obstacles - There will be Obstacles stopping the client getting from where they are now to where they want to go.

Way Forward - Identifying action steps to achieve goal.

User GoalDiscover

Appendix

Page 7: DocumentXD

Flow Chart A graphical notation that represents new process that proposes efficiency and quality.

Graphical Notation By providing a notation that is intuitive to business users, yet able to represent complex process semantics.

1. Understanding the current process (AS:IS)

2. Identifying cons and the new requirement

3. Brainstorm

4. Propose new Process Model

Business ModelDiscover

Appendix

Page 8: DocumentXD

Analysis A structured planning method used to evaluate the Strengths, Weaknesses, Opportunities, and Threats involved in a project.

Structured Planning Its important because they can inform later steps in planning to achieve the objective.

Participation

Need to ask and answer questions that generate meaningful information for each category (strengths, weaknesses, opportunities, and threats) to make the analysis useful and find their competitive

advantage.

SWOT ReportDiscover

Appendix

Page 9: DocumentXD

Hand Sketch Storyboards are used for planning a proposal or other business presentations intended to convince or compel to action.

Basic Understanding It helps the clients & team understand exactly how the requirement will work, much better than an abstract description. It is also cheaper to make changes to a storyboard than an implemented piece of software.

Illustration

Illustrations in a particular sequence for the intended purpose.

Story BoardDiscover

Appendix

Page 10: DocumentXD

1 Minute Video Carefully scripted animated video showcasing real benefit of the services.

Effective Communication Convey as much information as a stack of printed materials and make decisions faster.

Using storyboard as a base

Animated video will be created in Adobe aftereffects.

Product Vision VideoDiscover

Appendix

Page 11: DocumentXD

Brainstorming Group creativity technique, it is not the quality of ideas that matters but the quantity.

Not just sticking to one Idea Stimulating the creative process, getting the ideas from multi disciplinary team.

Brain Writing Technique

The technique involves 6 participants who sit in a group and are supervised by a moderator. Each participant thinks up 3 ideas every 5 minutes. The ideas are written down on a worksheet and passed on

to the next participant. The participant reads the ideas and uses them as inspiration for more ideas. Participants are encouraged to draw on others' ideas for inspiration, thus stimulating the creative

process. After 6 rounds in 30 minutes the group has thought up a total of 108 ideas

IdeationDiscover

Appendix

Page 12: DocumentXD

User Experience Lifecycle Flows that are tied to clear objectives allow us to Visualize a positive user experience.

Flow that leads to better results By creating a more cohesive user experience that drives better results for both the user and business.

By Identifying

End user and business objective is the first step to creating design flows that meet all of them.

User FlowDesign

Appendix

Page 13: DocumentXD

Appearance Basically a layout grid that indicates where the various elements are going to appear on the page.

First look It allows stakeholders to focus exclusively on the suggested layout - without the distractions of color, type, or other design elements.

By Identifying

Identifying what is required, what goes where on the page, and the percentage of space that each element requires.

Lo-Fi WireframesDesign

Appendix

Page 14: DocumentXD

Real Content Taking the approved LoFi wireframe layouts, and changing it to real content is on the section.

Decision Making

On information architecture and the navigation. It allows the customer to get a feel for their new proposed application.

Customer Feedback

Increased feedback generally leads to a better end-result.

Hi-Fi WireframesDesign

Appendix

Page 15: DocumentXD

Visual Communication Representing the aesthetics or look-and-feel of the front end.

The Purpose

To use visual elements like colors, images, and symbols to convey a effective message to its audience.

Simple is Hard

Simplifying design and bridge the gap between what it is imagined and pointing the way to a more beautiful product, again its an experience by itself.

Visual DetailingDesign

Appendix

Page 16: DocumentXD

Reducing the need for Change

The process of quickly mocking up the future state of a system

To fail early

Doing this rapidly and iteratively generates feedback early and often in the process

Make use of the Hi-Fi or Visual design

Converting it in to front-end frame work and having the intended interaction without involving actual data.

Rapid PrototypingDesign

Appendix

Page 17: DocumentXD

Goals of Usability Identifying the concerns between the planned Interaction and actual Interaction

To make necessary Change By Identifying problem areas in the interface.

Session Recording Using Quicktime Player

Usability Plan & ScriptDesign

Appendix

Page 18: DocumentXD

Standards For a general use of the application

To maintain consistency & experience And having uniformity across product and to help the development team with the specifications.

Documenting Colors, Fonts, Sizes etc.

Style GuideDesign

Appendix

Page 19: DocumentXD

Thanks