“Wireframing" has been around for a while…

It is the functional blueprint of our interactive systems.

low fidelity (sketching/ideation -> blocking)

mid fidelity (clickable mockups/coded prototypes)

content population/ design integration

Marketing-Based/Informational Website- Our Approach

NeedsAssementInitial

Meeting

Research /Strategy /Planning

Site OutlineSite Map

WireframesUser Flow

IA/ UX

Moodboards

Home PageArtwork

Landing/Detail Page(s)Artwork

Coding

Validation

ContentPopulation /Optimization

Browser &Platform Testing

Refinement

Launch

Search EngineSubmissionContent Outline/

Definition

ContentArchitecture

KICK OFF PLANNING CONTENT DESIGN DEVELOPMENT LAUNCH OPTIMIZATION

The Sticky Function – Wireframing is Data/Design Glue

Wireframing is the connection between the research and planning, and design phases. !• Translates documentation into

visual language

PRODUCT FUNCTIONALITY

Iteratively anticipate and design user interactions and validates usability. !• Pushes usability to the

forefront

• Improves functionality/improves design

Makes the "why?" drive the engagement !• Stay focused on project goals

An engaged client is a better client. !• Improves communication

• Lessens design pushback -clients involved will be better informed about the design and feel they have contributed to its creation.

Removing Roadblocks – Wireframes improve client relationships

Increases the value to the client, benefits the end product. !Client investment = validation

Make the project easier. !Project Road-mapping.

CLIENT RELATIONSHIPS

Everyone gets involved early = more functional teams !• Establishes Visual Language

• Everyone is on the same page

• Collaboration leads to breakthroughs

!• Creates space for the

sole prop/freelancer

Process. Process. Process. – Wireframes improve internal functionality

More exploration = more successful product. !• Wireframe for different

user groups, objectives and brand values

• Wide range of approaches can be refined, discarded, or combined for more effective solutions

Concurrent design and development + an early testing platform.

INTERNAL BENEFITS

BUSINESS BENEFITS

Saves time and money !• Identifies functionality early  

• Easier changes

• Limits late stage scope creep

• Measure twice, cut once- It is more expensive to change existing work than build it right first time.

An ounce of prevention is worth a pound of cure.

Proactive Engagement !• Control the perceived value of

your services and deliverables - tangible and intangible !

• Better client relationships

• Better, collaborative work environment

Transition from cost-oriented towards value-based pricing !• credible positioning,

deep experience, & strong client relationships

Thank You!

I N T E R A C T I V E

http://idiom.co @idiom_

Free Resources • konigi.com • wireframe.cc* • Invisionapp*

Paid Resources • Solidifyapp • Axure