BOOST YOUR DESIGN

WORKFLOW

OR GIT REBASE FOR DESIGNERS

4 years as a freelance web designer

2 years in Epam Systems

2 years in Jabra (GN Netcom)

Independent UX consultant

2009 20161985 2012 2014

Anton Parkhomenko | UX Engineer

1997

TIPS AND TOOLS CASES

“Welcome changing requirements, even late in development. Agile processes harness change for

the customer's competitive advantage.”

Principle 2 of 12 Agile Software Manifesto

http://www.agilemanifesto.org/principles.html

Product

Assets

Designer

DESIGN ART

Solving a problem Raising a question

Being an actor and following a script

Writing and interpreting your own story

Needs a collective acceptance Only needs an inner approval

Is an act of empathy Is an act of freedom.

TIPS AND TOOLS

HOW TO BOOST YOUR DESIGN WORKFLOW

Use GIT Automate

Be flexible Gather feedback

Use GIT

http://www.syntevo.com/smartgit/

https://www.sourcetreeapp.com/

https://desktop.github.com/

Automate

MyImage-iphone.pngMyImage@2x-iphone.pngMyImage@3x-iphone.png

MyImage-ipad.pngMyImage@2x-ipad.pngMyImage@3x-ipad.png

https://www.sketchapp.com/

https://www.invisionapp.com/craft

https://www.invisionapp.com/craft

https://www.invisionapp.com/craft

https://www.invisionapp.com/craft

https://www.invisionapp.com/craft

https://zeplin.io/

http://avocode.com/

http://marklyapp.com/

Be flexible

Be. Ready. For. Changes.

1. Use Symbols in Sketch

2. Use Symbols in Symbols in Sketch

3. Use Symbols in Symbols in Symbols in Sketch

Gather feedback /Prototype/

https://popapp.in/

Prototyping on Paper

https://www.invisionapp.com

Most popular prototyping tool

Framerframerjs.com

Origamifacebook.github.io/origami

Principleprincipleformac.com

Marvelmarvelapp.com

Craft Prototypeinvisionapp.com/craft#prototype

Axure RPaxure.com

Use GIT Automate

Be flexible Gather feedback

CASES

Case 1

• Small team of 4 developers (UX/Frontend, IOS, Android, Backend), PM, QA

• Extremely tight schedule (first release in 6 weeks)

• Inhouse UX and development, UI outsourced to external agency.

Given

Tools/technologies used

Highlights

• Sketch app was used for both wireframing and mockups.

• The wireframe .sketch file was a base for mockups and prototype screens.

• Wireframes were used to start the development as early as possible, app’s UI was being updated on-the-go

• Assets kept both in GIT and Zeplin project, with full access for developers.

Result

• The POC has been delivered in 6 weeks from scratch;

• The system built is capable to deliver any changes in extremely short terms, even the complete redesign.

Case 2

• Large company with 2 departments (Marketing and Online IT) and senior management involved;

• Microsoft ecosystem (MS Gold Partner company);

• Design is outsourced to external agency with no feedback;

• Powerpoint wireframes, zipped PSDs in email;

• Extremely slow stakeholders feedback;

• Outdated assets in Rally;

Given

/

Tools/technologies used

Highlights

• Marketing department commits the assets to the GIT repository;

• Exported assets available to developers via Git repo;

• Up-to-date mockups in Rally user stories - via direct Bitbucket/Invision links;

Result

• Twice increased development speed (improved communication);

• Improved quality (up-to-date user stories -> more attention to details, better testing);

Don't push. Explain. Communicate profits.

Q&A

http://bit.ly/boost_workflow_assets

gunnzolder@gmail.com github.com/gunnzolder

facebook.com/gunnzolder

KEEP IN TOUCH

THANK YOU