Andrew M. Snyder Photography

My buddy Andrew Snyder takes some stunning wildlife photography. He’s quite prolific on flickr, but until recently had no professional online presence. Recognizing an opportunity, I offered to help Andrew replace his outdated and spam-filled blog with a brand new site designed specifically to showcase his work. From idea to launch, services provided include custom Wordpress design and development, logo design, UX design, responsive design, and content migration.

Take a look at andrewmsnyder.com →

Reader and Readability

I have been “testing” iOS 5 for close to a month now and I must say my favorite addition is the Reader feature built into mobile Safari. In a nutshell, Reader lets you view web articles “free of clutter,” reducing pages to simple text, pictures, and links without annoying banners, ads, and navigation bars.

Because many pages are not formatted for mobile, Reader has proven to me super useful. (And the details are great. Check out that sweet background texture and bottom shadow.) These days I find myself opening links in Safari specifically for the Reader experience.

Apple has also incorporated Reader into its regular OS X Safari version. While I’m not a Safari user, I do like the Chrome extension iReader which does much of the same for the full web.

But, to step back for a second, why are these browser “add-ons” necessary for viewing the web? Shouldn’t the web be readable for every user independent of browser features?

On mobile, I think the rationalization is pretty clear. Much of the web was simply not designed or intended for the mobile experience. However, these days, that’s barely an acceptable excuse.

For the full web, I prefer the Reader experience because web articles come inevitably cluttered with too much distracting junk. Take any article on TechCrunch, for example.

The motivations are clear for most of these sites. Blogs and websites make money with ads. Bigger ads with prominent locations and more of them equals more money. I get it, not everyone can be like zenhabits. 

But do they really have to be so unpleasant to read! Here’s a thought, how about another icon/link (sigh) that directs the visitor to a readable version of the particular article. Pay attention TechCrunch. Instead of relying on Safari Reader, the site itself provides its own alternate reading experience for content only. Those annoying ads are still generating impressions, but all users have the option of reading in peace.

What I’ve Been Working On…

Ok, so there’s not exactly a dearth of mobile photo apps out there these days. Mostly, these apps focus on building a distinct social network around pictures, usually adding photo manipulation and commenting features. At a basic level, these apps are about creating and sharing. 

But, what if viewing photos was the goal? Twitter itself is already a great source of photo content. So what if Twitter was dedicated to images? Designed for consumption over sharing. What would that app experience look like? That’s what I’m working on… 

Portfolio StockMaps

They say ideas don’t matter. It’s all about the execution, stupid. In that spirit, I post here the idea that dominated my head in late 2009. Portfolio StockMaps is an app concept that brings the power of treemaps to the personal stock portfolio. Treemaps for the stock market are quite common, but the visualization, to my knowledge, has never been applied at the personal portfolio level.

A full walkthrough can be found here. While I haven’t done a recent survey of the financial app space, I doubt you’ll find direct competition. As ideas go, this concept never got off the drawing board. At the time, I felt the technical complexity of parsing stock data and rendering treemaps was beyond my ability to execute. It was, however, an excellent exercise in iPhone app design. And, I still think it’s a decent idea!

Book Notes: Don’t Make Me Think

Ask a UX designer to suggest a few books on the user experience topic and Steve Krug’s Don’t Make Me Think usually tops the short list. Published in 2000, Krug’s overview of web usability is both practical and concise. While many of the examples are clearly dated by today’s standards, Krug’s points are still pertinent. Included here are my compiled notes on the book. I have highlighted my favorite excerpts.

• “If something is hard to use, I just don’t use it that much.”
• If something requires a large investment of time (or it looks like it will), it’s less likely to be used.
• Eliminate the question marks (cognitive workload).
• Making pages self-evident (compared to self-explanatory) is like having good lighting in a store: it just makes everything seem better.
• 3 facts about real world web use:
  • We don’t read pages, we scan them.
  • We don’t make optimal choices, we sacrifice. (We don’t choose the best option, we choose the first reasonable option.)
  • We don’t figure out how things work, we muddle through.
• If your audience is going to act like you’re designing billboards, then design great billboards:
  • Create a clear visual hierarchy on each page.
  • Take advantage of conventions.
  • Break pages up into clearly defined areas.
  • Make it obvious what’s clickable.
  • Minimize noise.
• Innovate when you know you have a better idea (and everyone you show it to says “Wow!”), but take advantage of conventions when you don’t.
• When you force users to think about something that should be mindless (like what’s clickable), you’re squandering the limited reservoir of patience and goodwill that each user brings to a new site.
• Assume that everything is visual noise until proven otherwise.
• What really counts is not the number of clicks it takes me to get to what I want, but rather how hard each click is (the amount of thought required, and the amount of uncertainty about whether I’m making the right choice).
• Omit needless words.
• Websites have no sense of scale.
• When we want to return to something on a Web site, instead of relying on a physical sense of where it is, we have to remember where it is in the conceptual and retrace our steps.
• We’re inherently lost on the Web. Web navigation compensates for this missing sense of place by embodying the site’s hierarchy, creating a sense of “there.”
• Users usually end up spending as much time on lower-level pages as they do at the top; it’s vital to figure out navigation for all potential site levels.
• Mismatching link names to page names diminishes users trust in a site.
• If you’re a designer and you think a visual cue is sticking out like a sore thumb, it probably means you need to make it twice as prominent.
• The homepage needs to answer 4 questions:
  • What is this?
  • What can I do here?
  • What do they have here?
  • Why should I be here and not somewhere else?
• There are no simple “right” answers for most Web design questions (at least not for the important ones).
• Where debates about what people like waste time and drain the team’s energy, testing tends to defuse arguments and break impasses by moving the discussion away from the realm of what’s right or wrong and into the realm of what works or doesn’t work.
• Usability testing will sometimes settle arguments between designers and developers, but it usually ends up revealing that the disputed elements aren’t all that important.
• Focus groups are not usability tests.
• Usability testing does not have to be a big deal.
• For most Web teams their ability to find problems greatly exceeds the resources they have available to fix them; it’s important to stay focused on the most serious problems.
• The best kept secret of usability testing is it doesn’t matter much who you test; all you really need are people who have used the Web enough to know the basics.
• Most people enjoy the experience. It’s fun to have someone take your opinion seriously and get paid for it, and they often learn something useful that they didn’t know about the Web or computers in general.
• Test early, test often.
• Don’t get too excited about individual site reactions to site aesthetics.
• Typical findings from usability tests:
  • Users are unclear on the concept.
  • The words they’re looking for aren’t there.
  • There’s too much going on.
• Triage guidelines:
  • Ignore “kayak” problems: problems where users will go astray momentarily but manage to get back on tract almost immediately without any help.
  • Resist the impulse to add things.
  • Take “new feature” requests with a grain of salt.
  • Grab the low-hanging fruit.
• Don’t make the user jump through hoops just because you don’t want write a little bit of code.

TweetDeck for Chrome, Do This

Hey @ChromeDeck, you should add this feature.

The best part of TweetDeck is the ability to organize Twitter lists into columns. But, there is a limit to the amount of columns that fit on screen. Sure you can add more off screen, but horizontal scrolling is so painful.

May I suggest the ability to minimize each column. When columns are minimized, twitter avatars still show and update, but they don’t take up so much screen space. This is great for columns that don’t update too often. You can even hover over the avatars to see a quick view of each tweet. Click the avatars to maximize the column and return all expected interaction.

Prototype found here.

Less is More: BlackBerry Column View

I’ve been a BlackBerry Tour 9630 owner for just about 2 years now. Despite its many limitations, I have found my BB to be a quite serviceable smartphone. If you’re part of the Crackberry club, you know navigating the full Internet via the native browser is incredibly frustrating. Upon initial load, most pages, e.g. those not specifically formatted for viewing on mobile devices, require all sorts of zooming and panning to read the desired text. (I can’t speak to the most recent BB software update, but I doubt the experience is markedly better.)

Over time, you reluctantly conclude your device is in fact not an iPhone. However, you also realize that your BB has this nice option called Column View that attempts to improve the readability of full webpages (I believe it’s called Text View in newer models). By violating the coded CSS and wrapping the page into a single column, Column View creates a mangled but more efficient reading experience. Zooming and panning are reduced to simple vertical scrolling and text is standardized to a readable line height.

As a consequence however, most webpage “decorations” such as images, ads, and navigation bars are rendered illegible and pushed to the beginning or end of the page. Column View is really intended for viewing text quickly. In addition, because all content is squeezed into a single column, the vertical scrollbar on the right provides minimal clue as to how lengthy the text body is.

I’ve been practicing this tactic for some time now, and despite its difficulty in reformatting a full webpage, I realize I actually enjoy reading news articles and blog posts this way. When it comes to long articles, I prefer this method. Why? When you don’t know how long an article is, you are more inclined to finish reading the entire post if you are intrigued by the content.

Follow me on this logic. I am a frequent New York Times reader and like most newspapers, the NYT likes to publish stories of varying length. Because NYT articles can reach 6 or more pages, I find myself quickly scrolling to the bottom of the page to determine how long the article is. This way, I am able to make an estimation of how much time it may take me to finish reading. If the article length does not equate to the value or interest I place in the discussed topic, I will not finish reading. This quick scan to the bottom, is really only possible on computer web browsers. On my BB, I would never spend the time to make this guess. It would take too long. Because Column View tells me next nothing about article length, I am forced to simply start reading based on the topic. Sometimes, after a while, I realize I’m tackling a 6 page story on my phone.

The counterintuitive hypothesis here is that with less information, the user will accomplish more. Upon first glance, BB Column View allows the user to focus on the content by filling the screen with more readable text. Upon further inspection, without an accurate scrollbar, the user also isn’t burdened with article length. The content is most important and it will decide whether I finish reading.