- RunKeeper is More Valuable Than My Car
Let’s be honest, RunKeeper is just a $9.99 iPhone application to track runs, right? You activate it, you start running down the street, it tells you how fast you are going, knows where you went via GPS, and remembers it so you can look at it later. It’s simple. Actually, it’s a little more important […]
- Why Would You Dare Put Real Content Into Wireframes?
Our design team recently redesigned a high-level product category page of a company’s ecommerce site. Client stakeholders were excited to adopt video and other rich media to tell stories about products and campaigns, and our mission was to smoothly integrate this media-rich direction with existing promotions and the page’s primary goal: product navigation & findability. […]
- Documenting a Component with Pictures
In my upcoming book Modular Web Design, I describe how to document a component with attributes much like a pattern: use when, guidelines, a taxonomy of variations and examples, and a picture much like a pattern’s “sensitizing example.”
For that picture, I’ve come up with a table of options with pros and cons, and would love […]
- Upcoming Modular Web Design Workshops
Spring time approaches, and I’ll be facilitating workshops at two great conferences in the coming months.
Information Architecture Summit
March 19-21 in Memphis, TN
For the first time in my career, I’ll be facilitating a pre-conference workshop at the IA Summit! I’m very excited, and look forward to some great brainstorming, conversation, and excitement as we cut up […]
- Why InDesign?
Recently I was asked to quickly summarize why EightShapes usually chooses Adobe InDesign as our baseline tool for creating user experience documentation (in particularly, sophisticated systems for wireframes and annotated deliverables). I should have a set series of slides on the topic. But I don’t.
Admittedly, InDesign’s learning curve for getting started exceeds most if not […]
- Simple (Wire)Frames Made Easy With “Next Style”
Although wireframes can often reflect very sophisticated interactions, other times all we need is a simple layout with a bunch of boxes with headers and content like lists, paragraphs, images, and links. Using a combination of object and paragraph styles with Adobe InDesign CS3/CS4 makes creating simple frames with headers very easy.
The following video demonstrates […]
- Wireframes on the Left, Annotations on the Right
When annotating a wireframe, which side do you put the picture on? And, more importantly, are you doing it right?
Information architects devote much time and care producing annotated wireframes. In large part, this boils down to positioning pictures (i.e., a wireframe) adjacent to words (i.e., the annotations) to tell a story that neither could tell […]
- What Site Does a Component Library Reflect?
When creating a library based on an existing design system, teams can become perplexed as to what library should be made available.
The options are:As-Is: The production site reflects the current state of the experience, including all the concessions and trade-offs made to get launched. As such, it may not be an optimized design and may […]
- Interactive “Paging” for Wireframe Folds in a Deliverable
Tall wireframes are hard to position on a letter landscape page. I know. I’ve heard it too many times to count.
So, alright, this might not be the BEST idea I’ve ever had. However, it’s worth a post.
I’m asked frequently why we go with a letter landscape orientation for our default deliverable document. The primary objection […]
- Annotating States (Part 1 of 3)
What is a state?
A state is a condition or mode of being, where the user interface or system satisfies particular conditions and/or awaits an interaction. Under different settings, the UI will produce perceivably different display variations or results. When annotating an interaction design, it’s helpful to comprehensive describe the range of states of each […]
