“Story First: Crafting Products That Engage” by Donna Lichaw—An Event Apart video
While many of us seek out the newest and shiniest tools, methods, and processes to build more successful products and services, we often overlook one of the oldest, leanest, most effective tools out there: the structurally sound st…
“Story First: Crafting Products That Engage” by Donna Lichaw—An Event Apart video
While many of us seek out the newest and shiniest tools, methods, and processes to build more successful products and services, we often overlook one of the oldest, leanest, most effective tools out there: the structurally sound st…
“Story First: Crafting Products That Engage” by Donna Lichaw—An Event Apart video
While many of us seek out the newest and shiniest tools, methods, and processes to build more successful products and services, we often overlook one of the oldest, leanest, most effective tools out there: the structurally sound story. In the moment, we humans experience everything as if it were a story. The better the story, the more likely we are to want to use a product, continue to use it, pay to use it, and recommend it to others.
In this presentation captured live at An Event Apart Denver, Donna Lichaw (@dlichaw) brilliantly explains how taking a story-first approach to product design and development helps you build more successful websites, apps, campaigns, and services that excite your customers, draw them in, incite them to action, and keep them engaged over time.
Donna is a certified professional coach, speaker, and author. She has spent 20 years at the forefront of technology helping leaders at places like Google, Apple, Logitech, Capital One, Central Park Conservancy, and WNYC develop successful products and services and now uses that same passion and approach to develop successful people—one story at a time. You can learn more about her process in her book, The User’s Journey: Storymapping Products That People Love.
Enjoy all the videos here in An Event Apart’s library. There are over 30 hours of them—all absolutely free! For more insightful presentations by the industry’s best and brightest, come to An Event Apart—three days of design, code, and content for web, UX, and interaction designers. And for your free monthly guide to all things web, design, and developer-y, subscribe to The AEA Digest.
“Story First: Crafting Products That Engage” by Donna Lichaw—An Event Apart video
While many of us seek out the newest and shiniest tools, methods, and processes to build more successful products and services, we often overlook one of the oldest, leanest, most effective tools out there: the structurally sound story. In the moment, w…
“Design for Real Life” by Eric Meyer—An Event Apart Denver 2017
We constantly stress-test our work by subjecting it to a wide variety of devices, by simulating different connection speeds, and by testing it under extreme server load scenarios. But have you ever stress-tested your work for unexa…
“Design for Real Life” by Eric Meyer—An Event Apart Denver 2017
We constantly stress-test our work by subjecting it to a wide variety of devices, by simulating different connection speeds, and by testing it under extreme server load scenarios. But have you ever stress-tested your work for unexa…
“Design for Real Life” by Eric Meyer—An Event Apart Denver 2017
We constantly stress-test our work by subjecting it to a wide variety of devices, by simulating different connection speeds, and by testing it under extreme server load scenarios. But have you ever stress-tested your work for unexamined assumptions, emotional minefields, or usability in situations of extreme distraction?
In this free 60-minute video, captured live at An Event Apart Denver: Special Edition 2017, world-renowned author and consultant Eric Meyer uses real-world examples and interactive exercises showing how to QA your work for real life, enabling it to serve more people, more of the time.
Eric A. Meyer is an internationally recognized expert on the subjects of HTML, CSS, and web standards, and the author of Design For Real Life (A Book Apart), Cascading Style Sheets: The Definitive Guide (O’Reilly & Associates), Smashing CSS (Wiley), Eric Meyer on CSS and More Eric Meyer on CSS (New Riders), CSS2.0 Programmer’s Reference (Osborne/McGraw-Hill), and CSS Web Site Design (Peachpit), as well as numerous articles for A List Apart, Net Magazine, Netscape DevEdge, UX Booth, UX Matters, the O’Reilly Network, Web Techniques, and Web Review.
Enjoy all the videos in An Event Apart’s library. There are over 30 hours of them—all absolutely free! For more insightful presentations by the industry’s best and brightest, come to An Event Apart—three days of design, code, and content for web, UX, and interaction designers. And for your free monthly guide to all things web, design, and developer-y, subscribe to The AEA Digest.
“Design for Real Life” by Eric Meyer—An Event Apart Denver 2017
We constantly stress-test our work by subjecting it to a wide variety of devices, by simulating different connection speeds, and by testing it under extreme server load scenarios. But have you ever stress-tested your work for unexamined assumptions, em…
Articles, Links, and Tools From An Event Apart Orlando 2018
Jeffrey Zeldman
Beyond Engagement: the Content Performance Quotient
No More FAQs: Create Purposeful Information for a More Effective User Experience by Lisa Wright
The King vs. Pawn Game of UI Design by Erik Kennedy
Why Perfo…
Articles, Links, and Tools From An Event Apart Orlando 2018
Jeffrey Zeldman
- Beyond Engagement: the Content Performance Quotient
- No More FAQs: Create Purposeful Information for a More Effective User Experience by Lisa Wright
- The King vs. Pawn Game of UI Design by Erik Kennedy
- Why Performance Matters by Jeremy Wagner
- Marlboro Man (Wikipedia)
- @DesignCPQ on Twitter
- Performance: Showing Versus Telling by Laura Hogan
- Planning for Performance by Scott Jehl
- We need design that is faster and design that is slower.
- Art Direction and the Web by Stephen Hay
- Large Type: One Web Designer Puts Content First in a Big Way by Anthony Wing Kosner
- Authoritative, Readable, Branded: Report From Poynter Design Challenge, Part 2
- To Save Real News
- The Big Web Show № 171: Art Directing the News – with ProPublica Design Director David Sleight
- Top Task Management: Making it Easier to Prioritize by Gerry McGovern—An Event Apart video
- Organizing Mobile by Luke Wroblewski
- Redesigning in Public Again
- The Year in Design
Sarah Parmenter
- 256 Web Safe Colours and Names
- Gary Vee
- Vanity Metrics
- Google Digital Garage
- Social Views Per Day
- Snapchat’s Weakness is the “Olds”.
- Video will account for 80% of Consumer Traffic in 2019
- Virgin Holidays
- Klarna
- Facebook Pixel
- [Infographic] Marketers Who Use Video Outperform Their Peers
- Facebook Audience Insights
- trends.google.com
- Google My Business
- Hashtagify
- Planoly
- Trust in Earned Advertising Grows in Importance
- Search for Influencers in a Given Market
- Instagram Influencer Rates
- Away Travel
Rachel Andrew
- Code Collection of examples used
- CSS Grid Specification
- Flexbox Specification
- Box Alignment Specification
- CSS Intrinsic and Extrinsic Sizing Specification
- Grid by Example
- CSS Grid documentation on MDN
- Mozilla CSS Grid playground
- CSS Grid Gotchas and Stumbling Blocks
- Naming Things in CSS Grid Layout
- Breaking out with CSS Grid Explained
- CSS Grid Fallbacks and Overrides Cheatsheet
- Should I try to use the IE implementation of Grid Layout
- Using Feature Queries in CSS
- CSS Grid – Supporting browsers without grid
- Naming things in CSS Grid Layout
- MDN Flexbox docs
- Getting Started With CSS Layout
- Best Practices With CSS Grid Layout
Eric Meyer
- CSS Conditional Rules Module Level 3
- Picture credit: Innerbelt Bridge by Erik Drost, used under the terms of CC BY 2.0; minor straightening and color enhancement applied
- CSS:TDG4e Table of Contents
- CSS Flexible Box Layout Module Level 1
- Speaker pages:
- An Event Apart San Francisco 2018 store page (note: page will expire December 2018)
- CSS Grid Layout Module Level 1
- How We Adopted CSS Grid at Scale
Jen Simmons
- Layout Land on YouTube
- Layout Land
- Jen Simmons
- @jensimmons
- Firefox Nightly
- Example 1, HTML Flow only
- Example 2, Fluid Web Design
- Example 2.5, Fluid Web Design
- Example 3, Fixed Web Design
- Example 4, Responsive Web Design
- Example 5, Intrinsic Web Design
- Example of Image Options
- Stages of Squish
- Nesting Contexts
- Teaser card
- Multiple Teaser Card nested in a Grid layout
Una Kravets
Design Systems
- Shopify Polaris
- Primer
- GitHub Style Guide
- Carbon Design System
- IBM Design Language
- Lightning Design System
- Welcome to the MailChimp Content Style Guide
Resources
- Website Style Guide Resources
- A collection of awesome design systems
- Voice & Tone
- Introducing design systems
- Setting up An Accessibility Dashboard from Scratch with Pa11y on DigitalOcean
- Space in Design Systems
Tooling
Dan Mall
- Zeplin
- The Agile Manifesto
- Is there any value in people who cannot write JavaScript?
- The Value of HTML and CSS with Mandy Michael and Lara Schenck
- The Brand Gap
- The Hammer and The Chisel
- Designer + Developer Workflow
- Defining Product Design: A Dispatch from Airbnb’s Design Chief
- What Google Learned From Its Quest to Build the Perfect Team
Kristina Halvorson
Jason Pamental
- Resources on Variable Fonts on my site
- Essay explaining variable fonts as a concept (good for less techy and more designy/brandy folks as well) (also links to the same essay on CodePen)
- My Codepen Demos
- Clearleft/Rich Rutter – How to use Variable Fonts in the Real World
- Firefox Nightly (font tools!!!)
- Mozilla blog post on VF support and font tools
- Type Network Variations Guide
- Monotype’s Variable Fonts intro:
- Microsoft Variable Font Demo Site
- Wentin’s Font Playground
- Wakamai Fondue (What Can My Font Do… get it?)
- Axis-Praxis.org
- V-Fonts
- Monotype Variable Font Tester
- Brad Frost ‘ish’ Responsive Resizer
- Sahar Afshar & José Miguel Solé on evolving interfaces for Arabic typography on the web
- Code examples and demos for Arabic variable fonts
- W3C Github CSS Fonts Level 3
- W3C Github CSS Fonts Level 4 (variable fonts and other bits)
Fonts In Use
- Roslindale by DJR
- FF Meta by Monotype
- Avenir Next by Monotype (it’s an earlier beta, but open to download)
- Cera Pro by Typemates (variable font is a beta, but you should ask them about it and tell ’em I sent ya)
- Amstelvar by Type Network
- Bello Write by Underware
Trent Walton
- Harry Roberts’ tweet
- Jason Fried’s tweet
- General Data Protection Regulation (Wikipedia entry)
- Privacy by design (Wikipedia entry)
- GDPR for Web Developers
- 30% of all Internet users will ad block by 2018
- Survey shows US ad-blocking usage is 40 percent on laptops, 15 percent on mobile
- Firefox will soon be blocking trackers by default
- Ghostery
- Calibre
- SpeedCurve
- Dareboost
- HAR Resources
- Charles
- Driving WebPagetest from a Google Docs Spreadsheet
- Request Map Generator
- BuiltWith
- Posts Tagged “Third-Party” at trentwalton.com
- Trackers | Better
- Third-Party Script Prevalence on Alexa Top 50
- Tweet about BBC load abandonment
- WebPagetest
Aarron Walter
- Make Space: How to Set the Stage for Creative Collaboration
- GV Guide to Design Critique
- Etsy’s Debriefing Facilitation Guide for Blameless Postmortems
- Enterprise Design Sprints by Richard Banfield
- The DesignOps Handbook by Dave Malouf, Collin Whitehead, Meredith Black, and Kate Battles
- DesignBetter.Co
Josh Clark
More on this topic from Josh
- Design in the era of the algorithm
- Systems smart enough to know they’re not smart enough
- The Juvet Agenda
- The state of UX in UI (User Defenders podcast)
- Designing with artificial intelligence: the dinosaur on a surfboard (Presentable podcast)
- The rise of artificial intelligence: how AI will affect UX design (Adobe interview)
- Making software with casual intelligence
- Stop pretending you really know what AI is
- AI first—with UX
- In a few years, no investors are going to be looking for AI startups
- “Algorithms aren’t racist. Your skin is just too dark.”
Context
- Benedict Evans: Ways to think about machine learning
- MIT Technology Review: Machine Learning: The New Proving Ground for Competitive Advantage
- Harvard Business Review: In the AI age, “being smart” will mean something completely different
- Kranzberg’s laws (PDF)
Example applications
- Slack topic search: A new way to discover and connect with just the right teammates
- The Washington Post’s robot reporter has published 850 articles in the past year
- Automated Journalism – AI Applications at New York Times, Reuters, and Other Media Giants
- Google Forms: No Machine Learning in your product? Start here
- Post-It Plus app captures Post-Its in digital form
- CycleGAN transforms photos of apples into oranges, horses into zebras
Robot designers: AI for design and code
Machine learning APIs and data sets
- Microsoft cognitive services
- Amazon Web Services (AWS) machine learning
- Google Cloud AI building blocks
- IBM Watson products and services
- Topbots: Chihuahua or muffin? Searching for the best computer vision API
Customize or construct your own model
- Lobe (user-friendly visual interface)
- Google Cloud AutoML
- Microsoft Custom Vision
Open-source data sets
- Open Images
- Mozilla’s Common Voice data set
- Google’s “Quick, Draw!” data set
- Large self-annotated corpus for sarcasm
Designing for speech interfaces
- Awni Hannun: Speech recognition is not solved
- Benedict Evans: Voice and the uncanny valley of AI
- Cooper: Talking to machines is primitive and frustrating, but it’s gonna be huge
Mental models and opaque logic
- MIT Technology Review: The dark secret at the heart of AI
- Ralph Ammer: Make me think! The design of complexity
Surveillance capitalism
- Vicki Boykis: What should you think about when using Facebook?
- Digital Content Next: Google data collection research
- Gizmodo: Facebook is giving advertisers access to your shadow contact information
Designing to counter misinformation, error and bias
- Facebook: Designing against misinformation
- Book by Cathy O’Neil: Weapons of math destruction
- ACLU: Amazon’s face recognition falsely matched 28 members of congress with mugshots
- Google’s speech recognition has a gender bias
- AI programs are learning to exclude some African-American voices
- Passport system rejects this dude’s photo for a pretty racist reason
- Google mistakenly tags black people as ‘gorillas,’ showing limits of algorithms
- Machine Bias: There’s software used across the country to predict future criminals, and it’s biased against blacks.
Manner and language as cues for confidence and interaction
- Wikipedia: Paralanguage
- Amazon: Alexa speechcons
- Google: Google Duplex
- Jeremy Keith: Google duplicitous
Machine ethics
- The Juvet Agenda
- Book by Cennydd Bowles: Future Ethics
- Mike Loukides: The ethics of artificial intelligence
- Genevieve Bell: From human-computer interactions to human-computer relationships
- The European Union’s General Data Protection Regulation