Design
“I agree” checkbox syndrome
The “I agree” checkbox has become an interface standard on registration forms. “I agree to the terms and conditions.” While it’s purpose is generally understood by the consumer, it is a key source of frustration for people registering for accounts.
eBay's Registration, as an example
Why it’s overlooked:
- Checkboxes are small, particularly ones which aren’t grouped in a fieldset;
- They are typically at the bottom of a form – Out of sight out of mind;
- They are placed in close proximity to a larger button which takes the focus.
Design Last Design
Agility comes from your ability to rapidly gather feedback about the software you are building, and to react quickly. This is especially true during your initial build phase.
Interface First Design
I’ve always been a supporter of Interface First Design. To your customer, the interface is the product. The customers needs are all defined by the way they interact with your product. This is why we have always encouraged designing the interface before writing any code. This keeps developers from over-engineering features and ensures the customer gets what they expect from you.
However, I often find myself over-designing. I waste a lot of time designing things that will be deleted in future iterations.
Introducing Design Last Design (DLD)
Recently, I’ve been experimenting with what I call “Design Last Design.” Essentially this means we sketch out a user interface in the beginning, as we always have, but we don’t pretty it up. We build the whole application in greyscale with standard fonts, and boxes, but nothing pretty. Near the end of the project, we wrap it all up with graphic design. The interactions are all still designed up front, but the graphic design is laid on at the end. We don’t waste time on graphical details which are not yet important.
Is Blue Still The Best Color For Links?
I set out to write a post which proves that blue links are not more user friendly than links of other colors. It is a topic all web designers have wrestled with at some point. Many of us, including myself, believe that links of any color can be equally usable as long as they:
- Are of contrasting color from the body text;
- Are underlined;
- Change color when visited;
However, when I began researching this article it became clear that the scientific evidence was against me. Articles, old and new, clearly prove that users find links significantly faster when they are blue, underlined and change purple after being visited. Continue →
How to Label Submit Buttons
Submit button labels are often neglected as part of form design. Clear actionable text on these buttons is key to a person understanding what happens when they click on it.
HTML uses “submit” as it’s default text, which isn’t ideal in any situation. We often find ourselves labeling buttons badly, just because it’s become standard to do so.
Best Practices When Labeling Buttons
- Shorter is better. I should be able to, in a glimpse, understand what action will be taken on the form data I’ve just filled out. Continue →
Photoshop Kung-Fu: Evenly spaced columns and rows
When mocking up a web design or creative of some kind I often find myself dividing areas into equal spaced rows or columns. This is a simple task when dividing into 2 parts, since your guides snap to the center of a selected object. Dividing into 3’s is a little more difficult. Dividing into 4’s isn’t too bad since you can just divide by 2, then subsequently split the divisions by 2. There’s got to be a better way, and alas… there is.
Note: This applies to Photoshop CS2. There may be a more prominent way to do this in newer versions.
50 Tips To A User Friendly Website
Here is a list of 50 things that I keep in mind on every website that I build. Some of these are secrets I have acquired from the best designers in the world, and some of them are standard every day practices. Either way, these tips will improve your visitors experience on your website.
Sharing the Grid
When it comes to design, I’m a firm believer in simplicity. Occasionally I’m criticized for being overly simple, but I take that as a compliment. In my design, typography, grids, color, imagery and especially whitespace all stand for themselves. They don’t need any fancy treatment or “web 2.0″ effects. They work because they are simple and beautiful in their natural state.
Grids are foundational to all my designs. I always sketch out ideas on a Behance Dot-Grid Book, (thanks to Garrett Dimon for sharing this a few months ago). While these square grids are perfect for sketching idea’s and concepts, they don’t work for fine-tuning your design.
Worldmapper – Trending the globe
I am fascinated by the different ways people represent data. We grow accustomed to displaying data in the same old ways. We start to glance over the mundane bar graphs we see everyday. We forget that the relationship between the data is more important than the specific numerical values. Graphs are for trends, reports are for numbers.
Worldmapper takes the same old data we hear every day in the news and dares to present it uniquely. I think it makes their point well.
IE8 – Trying to become a real browser?
Microsoft posted an article on their Internet Explorer blog earlier this week where they claimed Internet Explorer 8 passed the Acid2 test. Internet Explorer has been the cause of many web design headaches due to blatent disregard for Web Standards. Microsoft may finally be feeling pressure from Opera and Mozilla to comply with Web Standards.
Search
Popular Posts
- 50 Tips To A User Friendly Website
- My Favorite Pomodoro Timers
- How to build a Gantt Chart with the Google Charts API
- Why Flash is Mostly Bad
- Sharing the Grid
- 10 Tips to Better Google Wave Conversations
- The difference between User Research and Usability Testing?
- How to Label Submit Buttons
- Our New Development Process
- Paper Prototyping vs. Balsamiq Mockups
Latest Comments
- Nate Klaiber → “ The design industry is plagued with the misconception that product manuals are evil. These designers believe that your product should be intuitive enough to use without a manual. While there is a certain truth to this, there are many viable reasons for product manuals to be used. There needs to be a certain…”
- Joe Fiorini → “ The design industry is plagued with the misconception that product manuals are evil. These designers believe that your product should be intuitive enough to use without a manual. While there is a certain truth to this, there are many viable reasons for product manuals to be used. There needs to be a certain…”
- Roger F Carver → “ The Google Charts API is an excellent way to add high quality charting to your web application. We first started working with the API as part of the Simpli5 dashboard development, and were quite impressed with its functionality and ease of use. Wrapper classes were developed and added to our Sandstone Application Framework to make…”
- Nate Klaiber → “ The “I agree” checkbox has become an interface standard on registration forms. “I agree to the terms and conditions.” While it’s purpose is generally understood by the consumer, it is a key source of frustration for people registering for accounts. eBay's Registration, as an example Why it’s overlooked: Checkboxes are small, particularly ones which aren’t grouped…”
- Josh Walsh → “ Most of the value you gain from a usability testing session comes from the analysis after the session is complete. I have been involved in a few sessions recently where no formal analysis has been conducted. I believe this is a mistake. Traditionally, the analysis portion of a usability session takes quite a long…”