Wireframing Essentials
An introduction to user experience design
Table of Contents
Wireframing Essentials
Credits
About the Author
About the Reviewers
www.PacktPub.com
Support files, eBooks, discount offers, and more
Why Subscribe?
Free Access for Packt account holders
Preface
What this book covers
What you need for this book
Who this book is for
Conventions
Reader feedback
Customer support
Downloading the color images of this book
Errata
Piracy
Questions
1. The Design Process
A high-level look at the design process
Research
The importance of research
Designing in an agile environment
Information architecture
Introducing flowchart development
Defining the shapes in flowcharts
Transitioning to wireframes
Usability testing
Visual design
Applying the visual layer
Delivery
Summary
2. Example Project – E-commerce Website
Research
Stakeholder interview
Competitive analysis
Personas
Weighing and prioritizing features
Information Architecture
Site map
Wireframing pages and content
Home page
Popular wireframing applications
Initial home page wireframe
Refined home page wireframe
Category pages
Product detail page
Shopping cart
Video library page
Mockups
Delivery
Reviewing the development efforts
Summary
3. Example Project – Mobile Device Application
Research
Stakeholder interview and persona development
Weighing features
Information Architecture
Interaction maps
Our first map
Our refined map
Sketches and mockups
Creating a new account
Finding your team
Joining a team
Your team's home page
Navigation options
Portal navigation
Global navigation
When to remove navigation
The Futbol Finder storefront
Shopping by product category
Usability testing
Presenting our deliverables
Summary
4. Research Techniques
Commonly used, effective research techniques
Stakeholder interviews
Design tenet scorecard
Competitive analysis
Personas and user profiles
Creating personas
Heuristic evaluation
Card sorting
Focus groups
User surveys
Brainstorming
Summary
5. Information Architecture and Visual Design Techniques
Information architecture techniques
Reality mapping
Task flow techniques
Page-level detail diagrams
Site map diagrams
Persona-based task flow diagrams
Screenshot interaction maps
Paper prototyping
Visual design techniques
Mood boards
Design scorecard
Designing in the browser
Summary
Index
Wireframing Essentials
An introduction to user experience design
Copyright © 2014 Packt Publishing
All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews.
Every effort has been made in the preparation of this book to ensure the accuracy of the information presented. However, the information contained in this book is sold without warranty, either express or implied. Neither the author, nor Packt Publishing, and its dealers and distributors will be held liable for any damages caused or alleged to be caused directly or indirectly by this book.
Packt Publishing has endeavored to provide trademark information about all of the companies and products mentioned in this book by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information.
First published: January 2014
Production Reference: 1200114
Published by Packt Publishing Ltd.
Livery Place
35 Livery Street
Birmingham B3 2PB, UK.
ISBN 978-1-84969-854-2
www.packtpub.com
Author
Matthew J. Hamm
Reviewers
Jeromy Condon
Jerome M. Griffith
Acquisition Editors
Andrew Duckworth
Joanne Fitzpatrick
Lead Technical Editor
Sruthi Kutty
Technical Editors
Shiny Poojary
Siddhi Rane
Faisal Siddiqui
Copy Editors
Alisha Aranha
Adithi Shetty
Project Coordinator
Aboli Ambardekar
Proofreader
Paul Hindle
Indexer
Mehreen Deshmukh
Production Coordinator
Nilesh R. Mohite
Cover Work
Nilesh R. Mohite
Matthew J. Hamm has been designing visual solutions and interactive user experiences in the Pacific Northwest since the mid 1990s. Specializing in User Experience (UX) design and Information Architecture (IA), Matthew has been active as a full-time in-house designer, UX consultant, freelance designer, and entrepreneur. This has given him a comprehensive view of the many different venues in which websites and applications are designed.
He has worked for and with clients such as Amazon.com, Atlatl Software, Microsoft, SumTotal Systems, Drugstore.com, Napera Networks, Target.com, ToysRus.com, BabiesRus.com, and Imaginarium.com.
When not designing software, he spends his time with his family in Portland, Oregon. In his spare time, he is a linocut printer and gold panning enthusiast. He also enjoys kayaking the beautiful rivers of the Portland area.
Jeromy Condon is a college instructor and freelance web developer based out of Seattle, Washington. He specializes in custom WordPress theme development and design using HTML5, CSS, PHP, and JavaScript. When he gets a spare moment, he loves to draw, take photographs, and explore the great outdoors.
Professionally, he is a big fan of minimalist, typographic-based design, and mobile user experience study. He teaches web development principles, web graphic design, UX, and web animation at Clover Park Technical College in Tacoma, Washington. He also runs his own freelance web business under the name Rufusmedia, specializing in custom website design and development.
Jerome M. Griffith is a highly motivated graphic designer, web designer/developer, artist, illustrator, and aspiring writer. He has completed many computer graphics, web development, and illustration projects for various clients around USA and in the Republic of Trinidad and Tobago, where he was born and raised. He has more than 17 years of professional experience working with various print, graphic, and web technologies, including food packaging designs, corporate desktop publishing, website design, and website publishing.
While working full-time as a production specialist in a well-known financial establishment in USA, he is also enrolled full-time as an undergraduate student in a distance learning program pursuing a Bachelor of Science degree in Information Technology-Software Emphasis, with projected graduation in 2016. He is building his portfolio and furthering his career in Information Technology with specialization in web development, UI/UX design, software development, and Java Oracle development.
He holds an Associates degree in Visual Communications-Interactive Design (2001) and has earned the industry-recognized CIW JavaScript Specialist, CIW Web Foundations Associate, and CIW Web Design Specialist Certification (2013). He also holds diplomas in Java E-Commerce Application Development and Oracle 9i SQL Development (2005).
Working under the pen name Jerome Matiyas, in his spare time, he writes and illustrates a series of historical fantasy adventure novels entitled the Epic Adventures of Mekonnen (Mekonnen Epic), thus d...