Designing UX : Because Modern Design is Never Static.
Coleman, Ben.
Designing UX : Because Modern Design is Never Static. - 1st ed. - 1 online resource (214 pages)
Intro -- Designing UX: Prototyping -- Notice of Rights -- Notice of Liability -- Trademark Notice -- About Ben Coleman -- About Dan Goodwin -- About SitePoint -- Table of Contents -- Foreword -- Acknowledgments -- Thanks -- Permissions (and Thanks!) -- Who Should Read This Book -- Conventions Used -- Tips, Notes, and Warnings -- Hey, You! -- Ahem, Excuse Me ... -- Make Sure You Always ... -- Watch Out! -- Supplementary Materials -- Defining the Case for Prototyping -- What is prototyping? -- Why use prototypes? -- Testing and Communicating UI Designs -- Saving Time and Money -- Bringing Users into the Design Process -- Engaging Stakeholders in a Meaningful Way -- Designing across Devices and Platforms -- Creating and Testing with Real Content and Data -- What can we prototype? -- Return of the Native -- Information Architecture and Structural Elements -- Layout and Visual Hierarchy -- Interactive Elements -- What can't we do with a prototype? -- Use Quantitative Research to Make Decisions -- Testing for Completion/Conversion Funnel Progress -- Testing Accessibility -- Testing the Impact of Visual Design -- Being the Sole Source of Documentation -- Who are prototypes for? -- Designers -- Developers -- Project and Account Managers -- Business Analysts -- Customer Support Representatives -- Prototyping on a Large Scale -- Summary -- The Prototyping Process -- When to Prototype -- You have an Idea -- Buy-in from Others -- Information Architecture to Visualize, Present, and Test -- A Lengthy User Journey or Several Changes of State over Time -- A Pool of Available Users -- Communicate and Test Designs across Devices -- Lots of Ideas-or No Ideas-for Solving a Problem -- More Time Spent Communicating than Developing -- Specific Aspects of a Design Are Performing Poorly -- Planning -- What are you aiming to achieve? -- What will you test and demonstrate?. Where will you place the boundaries? -- How will you use your prototype? -- Who will work on your prototype, and how? -- How much time, budget, and resources do you have? -- What's the starting point for your prototype? -- Gather Resources -- Existing Design Resources -- Stationery (for paper prototyping) -- Content -- Data -- Get On With It! -- Starting Top-down versus Bottom-up -- Recycling Your Material -- Working Collaboratively -- Iterate and Demo, Testing Early and Often -- Summary -- An Overview of Prototyping Tools and Techniques -- Segmenting and Categorizing Tools and Techniques -- Design Fidelity -- Tool Complexity and Speed of Use -- The Aim of Your Prototype -- Sorting Tools and Techniques into Our Three Categories -- How the Tools Have Been Grouped -- Tools that Failed to Make the Cut -- Summary -- Paper Prototyping -- What is paper prototyping? -- Pros -- Test Ideas Quickly -- Cheap and Involves No Tools or Training -- Particularly Suited to Collaborating -- Creating a Shared Understanding -- No Training Necessary -- No Technical Constraints -- Cons -- It's Unresponsive -- Lots of Stationery Required -- Needs Supervising -- Takes Practice and Experience to Run Research Sessions -- Not Easy to Share -- Difficult to Edit -- Making Paper Prototypes -- What You'll Need -- Your Approach -- Devices -- Desktop or Laptop -- Tablet -- Phone -- Screens -- Elements -- Interactivity -- Scrolling and sliding -- Menus -- Messages and Pop-up Boxes -- Tabs -- Accordions -- Slide Up / Down Reveals -- Select Boxes -- Checkboxes and Radio Buttons -- iOS / Android Native Design Elements -- Literally Anything -- Drawing Tips -- Paper Prototypes from Digital Files -- Collaboration = Team + Client + Users -- Collaborative Creation of Prototypes -- Materials for a Prototyping Workshop -- Outlining the Purpose -- Ready, Steady, Go! -- Marking the Playing Field. Presenting and Testing Ideas -- Voting -- Workshop Outcomes -- Variants on this Approach -- "Responsifying" an Existing Site with Paper Collage -- Screen Capture -- Printing and Converting to PDF for Large Images -- Slicing and Dicing -- Creating a New Design -- Sketching the Gaps -- The Finished Article -- Paper Prototypes in Use -- Presenting Ideas and Soliciting Feedback -- Testing the Prototypes with Users -- Roles in the Test Session -- Anatomy of a Test Session -- Digitizing Paper Prototypes -- Summary -- Creating Clickable Prototypes from Designs -- From POP to Marvel -- Marvel -- Marvel Summary -- Clickable PDFs -- Linking between Pages in a Design Tool -- Editing an Existing PDF to Add Hyperlinks -- Clickable PDFs Summary -- Tools Dedicated to Creating Clickable Prototypes -- Sketch -- The InVision Craft Plugin for Sketch -- InVision Summary -- Summary -- Integrated Tools for Drawing and Creating Prototypes -- Common Features in this Category of Prototyping Tools -- Drawing and Design Features -- Features Galore -- Increased Support for Prototyping Interactivity -- Prototyping Workflow Features -- Balsamiq -- Balsamiq Summary -- OmniGraffle -- AppleScript -- OmniGraffle Summary -- Axure -- The Difference between Adaptive and Responsive -- Axure Summary -- Keynote and PowerPoint -- Three Approaches for Using Keynote and PowerPoint for Prototyping -- Creating a Clickable Prototype from an Existing Design -- Using the Built-in Design Tools to Create a Prototype -- Prototyping Animations -- Sharing Prototypes Created in Keynote and Powerpoint -- Keynote & -- Powerpoint Summary -- Adobe XD -- Adobe XD Summary -- Summary -- Building HTML Prototypes -- The Pros of Using HTML -- Responsive Design -- Flexibility -- Complex Interactions -- Latest Technology -- Resources -- Source Control for Collaboration -- Source Control for a Historical Record. Various Sources of Content -- Accessibility -- Speed of Change -- And a Few Cons of HTML -- Learning Challenges -- Experience Limitations -- Planning is a Must -- Your HTML Prototype Planning Kit -- User Research -- Content -- Structure and Functionality -- Skills Required -- Tools for Rapid Prototyping -- Preprocessors for Writing CSS -- Tools for Interactivity -- Making Headway with Frameworks -- Bootstrap -- Foundation -- Pattern Lab -- Skeleton -- GDS Prototype Kit -- All the Frameworks -- Using Content in Prototypes -- Sourcing Content -- Using a Content Management System (CMS) -- Example CMSs Used for Prototyping -- Wordpress -- Perch -- Statamic -- Creating Accessible Prototypes -- Making Prototypes Available Online -- Sharing Your Prototype Remotely -- Moving Flat File Prototypes Online -- Moving Content-managed Prototypes Online -- Tools to Automate Deployment -- Managing Databases -- Hosting Providers -- Throwaway versus Reusable Code in HTML Prototypes -- HTML Prototyping Case Studies -- Dorothy House Hospice Care -- The Problem -- The Solution -- The Outcome -- An Online Store -- The Problem -- The Solution -- The Outcome -- MacGuffin -- The Problem -- The Solution -- The Outcomes -- BBC Nature Prototype iPad App -- The Problem -- The Solution -- The Outcomes -- Summary -- Using Prototypes in Your Project Workflow -- Exploring and Communicating Design Ideas with the Team -- 6-8-5 Sketching -- InVision Options -- Engaging with Stakeholders and Project Teams -- Share at the Right Time, and Keep Sharing -- Ensure Stakeholders Are Seeing the Latest Version -- Efficiently Use Stakeholders' Time and Attention -- Keep Promoting the Prototype -- Be Prepared for Stakeholder Feedback -- Bringing Users into the Design Process Using Prototypes -- Exploring Motivations and Behaviors in Contextual Research -- Testing Your Designs with Users. User Research Testing -- In-person/Remote and Moderated/Unmoderated Usability Testing -- Summary -- Supplementary Prototyping Tools Worth Seeking -- Craft by InVision -- Facebook Origami Studio -- Framer -- Need more of a Coffee Fix? -- Principle -- Xcode.
9781492019220
World Wide Web.
Electronic books.
TK5105.888.C654 2017
6.7
Designing UX : Because Modern Design is Never Static. - 1st ed. - 1 online resource (214 pages)
Intro -- Designing UX: Prototyping -- Notice of Rights -- Notice of Liability -- Trademark Notice -- About Ben Coleman -- About Dan Goodwin -- About SitePoint -- Table of Contents -- Foreword -- Acknowledgments -- Thanks -- Permissions (and Thanks!) -- Who Should Read This Book -- Conventions Used -- Tips, Notes, and Warnings -- Hey, You! -- Ahem, Excuse Me ... -- Make Sure You Always ... -- Watch Out! -- Supplementary Materials -- Defining the Case for Prototyping -- What is prototyping? -- Why use prototypes? -- Testing and Communicating UI Designs -- Saving Time and Money -- Bringing Users into the Design Process -- Engaging Stakeholders in a Meaningful Way -- Designing across Devices and Platforms -- Creating and Testing with Real Content and Data -- What can we prototype? -- Return of the Native -- Information Architecture and Structural Elements -- Layout and Visual Hierarchy -- Interactive Elements -- What can't we do with a prototype? -- Use Quantitative Research to Make Decisions -- Testing for Completion/Conversion Funnel Progress -- Testing Accessibility -- Testing the Impact of Visual Design -- Being the Sole Source of Documentation -- Who are prototypes for? -- Designers -- Developers -- Project and Account Managers -- Business Analysts -- Customer Support Representatives -- Prototyping on a Large Scale -- Summary -- The Prototyping Process -- When to Prototype -- You have an Idea -- Buy-in from Others -- Information Architecture to Visualize, Present, and Test -- A Lengthy User Journey or Several Changes of State over Time -- A Pool of Available Users -- Communicate and Test Designs across Devices -- Lots of Ideas-or No Ideas-for Solving a Problem -- More Time Spent Communicating than Developing -- Specific Aspects of a Design Are Performing Poorly -- Planning -- What are you aiming to achieve? -- What will you test and demonstrate?. Where will you place the boundaries? -- How will you use your prototype? -- Who will work on your prototype, and how? -- How much time, budget, and resources do you have? -- What's the starting point for your prototype? -- Gather Resources -- Existing Design Resources -- Stationery (for paper prototyping) -- Content -- Data -- Get On With It! -- Starting Top-down versus Bottom-up -- Recycling Your Material -- Working Collaboratively -- Iterate and Demo, Testing Early and Often -- Summary -- An Overview of Prototyping Tools and Techniques -- Segmenting and Categorizing Tools and Techniques -- Design Fidelity -- Tool Complexity and Speed of Use -- The Aim of Your Prototype -- Sorting Tools and Techniques into Our Three Categories -- How the Tools Have Been Grouped -- Tools that Failed to Make the Cut -- Summary -- Paper Prototyping -- What is paper prototyping? -- Pros -- Test Ideas Quickly -- Cheap and Involves No Tools or Training -- Particularly Suited to Collaborating -- Creating a Shared Understanding -- No Training Necessary -- No Technical Constraints -- Cons -- It's Unresponsive -- Lots of Stationery Required -- Needs Supervising -- Takes Practice and Experience to Run Research Sessions -- Not Easy to Share -- Difficult to Edit -- Making Paper Prototypes -- What You'll Need -- Your Approach -- Devices -- Desktop or Laptop -- Tablet -- Phone -- Screens -- Elements -- Interactivity -- Scrolling and sliding -- Menus -- Messages and Pop-up Boxes -- Tabs -- Accordions -- Slide Up / Down Reveals -- Select Boxes -- Checkboxes and Radio Buttons -- iOS / Android Native Design Elements -- Literally Anything -- Drawing Tips -- Paper Prototypes from Digital Files -- Collaboration = Team + Client + Users -- Collaborative Creation of Prototypes -- Materials for a Prototyping Workshop -- Outlining the Purpose -- Ready, Steady, Go! -- Marking the Playing Field. Presenting and Testing Ideas -- Voting -- Workshop Outcomes -- Variants on this Approach -- "Responsifying" an Existing Site with Paper Collage -- Screen Capture -- Printing and Converting to PDF for Large Images -- Slicing and Dicing -- Creating a New Design -- Sketching the Gaps -- The Finished Article -- Paper Prototypes in Use -- Presenting Ideas and Soliciting Feedback -- Testing the Prototypes with Users -- Roles in the Test Session -- Anatomy of a Test Session -- Digitizing Paper Prototypes -- Summary -- Creating Clickable Prototypes from Designs -- From POP to Marvel -- Marvel -- Marvel Summary -- Clickable PDFs -- Linking between Pages in a Design Tool -- Editing an Existing PDF to Add Hyperlinks -- Clickable PDFs Summary -- Tools Dedicated to Creating Clickable Prototypes -- Sketch -- The InVision Craft Plugin for Sketch -- InVision Summary -- Summary -- Integrated Tools for Drawing and Creating Prototypes -- Common Features in this Category of Prototyping Tools -- Drawing and Design Features -- Features Galore -- Increased Support for Prototyping Interactivity -- Prototyping Workflow Features -- Balsamiq -- Balsamiq Summary -- OmniGraffle -- AppleScript -- OmniGraffle Summary -- Axure -- The Difference between Adaptive and Responsive -- Axure Summary -- Keynote and PowerPoint -- Three Approaches for Using Keynote and PowerPoint for Prototyping -- Creating a Clickable Prototype from an Existing Design -- Using the Built-in Design Tools to Create a Prototype -- Prototyping Animations -- Sharing Prototypes Created in Keynote and Powerpoint -- Keynote & -- Powerpoint Summary -- Adobe XD -- Adobe XD Summary -- Summary -- Building HTML Prototypes -- The Pros of Using HTML -- Responsive Design -- Flexibility -- Complex Interactions -- Latest Technology -- Resources -- Source Control for Collaboration -- Source Control for a Historical Record. Various Sources of Content -- Accessibility -- Speed of Change -- And a Few Cons of HTML -- Learning Challenges -- Experience Limitations -- Planning is a Must -- Your HTML Prototype Planning Kit -- User Research -- Content -- Structure and Functionality -- Skills Required -- Tools for Rapid Prototyping -- Preprocessors for Writing CSS -- Tools for Interactivity -- Making Headway with Frameworks -- Bootstrap -- Foundation -- Pattern Lab -- Skeleton -- GDS Prototype Kit -- All the Frameworks -- Using Content in Prototypes -- Sourcing Content -- Using a Content Management System (CMS) -- Example CMSs Used for Prototyping -- Wordpress -- Perch -- Statamic -- Creating Accessible Prototypes -- Making Prototypes Available Online -- Sharing Your Prototype Remotely -- Moving Flat File Prototypes Online -- Moving Content-managed Prototypes Online -- Tools to Automate Deployment -- Managing Databases -- Hosting Providers -- Throwaway versus Reusable Code in HTML Prototypes -- HTML Prototyping Case Studies -- Dorothy House Hospice Care -- The Problem -- The Solution -- The Outcome -- An Online Store -- The Problem -- The Solution -- The Outcome -- MacGuffin -- The Problem -- The Solution -- The Outcomes -- BBC Nature Prototype iPad App -- The Problem -- The Solution -- The Outcomes -- Summary -- Using Prototypes in Your Project Workflow -- Exploring and Communicating Design Ideas with the Team -- 6-8-5 Sketching -- InVision Options -- Engaging with Stakeholders and Project Teams -- Share at the Right Time, and Keep Sharing -- Ensure Stakeholders Are Seeing the Latest Version -- Efficiently Use Stakeholders' Time and Attention -- Keep Promoting the Prototype -- Be Prepared for Stakeholder Feedback -- Bringing Users into the Design Process Using Prototypes -- Exploring Motivations and Behaviors in Contextual Research -- Testing Your Designs with Users. User Research Testing -- In-person/Remote and Moderated/Unmoderated Usability Testing -- Summary -- Supplementary Prototyping Tools Worth Seeking -- Craft by InVision -- Facebook Origami Studio -- Framer -- Need more of a Coffee Fix? -- Principle -- Xcode.
9781492019220
World Wide Web.
Electronic books.
TK5105.888.C654 2017
6.7