A sense of direction. [UI Design]

Today, as my daughter watched her Your Baby Can Read video, I had ghosts of the 99% Invisible podcast dancing through my head. In a flash I realized that the time-line indicator on every video program or site moves from left to right. This is was someone’s conscious design choice. There was an option to move from right to left.

The Your Baby Can Read videos show words and then have an arrow underneath them that slide from left to right to train the babies to scan words that way. Again… left to right.

Once you think about it, the time-line indicator decision is obvious. We scan everything from left to right. It’s second-nature but it’s not natural, it’s something we learn before we even realize it.

My question: do time lines and play buttons in Israel, Iran and Saudi Arabia go the other way?

Make it Make Sense (Good Design)

Your website, flier, magazine, or whatever product – should make sense. It should be intuitive and take into consideration the ways that people will really use it.

Last week, fellow NoVA resident Nathan Herald wrote about his love of good product design.

I want to create content management systems, ecommerce platforms, reusable tools, and other internet related things. I also catch myself wanting to design clothing, bags, storage solutions, and other things that I interact with often. If I can’t find something I love then I want to make it.

[…]

A balance between being terribly useful and practical while being awesomely intuitive and usable and pleasing to the eye seems to be very important to me. I see examples of this everywhere in my house: iPhone, Puma shoes, white fitted hat, front pocket wallet, G2 .5mm pens, moleskins, and many more.

While his shorts of choice (they are held together by about 40 safety pins) might call this love of his into doubt, he makes a great point. The products & websites that we love are the ones that balance beauty and intuitive design.

  • Moleskine products lay flat so it’s easy to write in them.
  • Google’s main page is their logo and a search box. (Until today, I guess.)
  • The iPhone and iPad have become famous for how easy they are to use for a complete novice.

This week two sites that I spend a lot of time on released updates to their design.

DesiringGod.com rolled out a new beta version of their site. I’m not concerned as much with the features as the fact that they added a video with their senior web manager (the ministry has a whole team for their website) explaining the reason why they did. The redesign is to better mobilize people to use the site and to help them be empowered to use the information there in the rest of their lives.

Crossway Bible publishers released a new edition of the English Standard Version’s website. I love the new design. (Some of the better features require you to purchase access to the study notes.)

  • Linked Note Scrolling: This was my biggest peve in the old version. I’d be reading a passage and wanted to look at the notes on that passage and I’d have to scroll around to find them on the side. Now the two boxes are linked. When I am at verse 5 so is the verse pane.
  • Movable Tool Tabs: Do you want your notes on the right? Drag them there. On the left? Drag them back.
  • Bookmarks: you can place virtual bookmarks in your online Bible. They work just like real ones. They stay until you move them somewhere else and all you have to do is click on one of them to go to that passage.
  • Infinite Scrolling: You don’t ever have to use pagination links to go to the next chapter, just keep scrolling down.
  • Column Reordering: Want your sidebars on the left? Right? Both sides? Just one sidebar? Do it.
  • Highlighting & Sharing: Just highlight a passage  and choose a color or click the share (or copy or add a note) link.

Websites should be fully featured and beautiful.

How do you move toward this in the things you create & use?

Is display:none cheating?

So, I’ve been doing a lot of web design stuff lately and I have this thing that I do that feels like cheating.

Sometimes I can’t find that code that is inserting something onto the page, I look through plugins and themes and everything and I can’t find where this little snippet or that little image is coming from. So I figure out what the code is that surrounds it, I head into my CSS editor and I add a little bit of code:

display: none;

Guess, what it does! It makes it not show up on the page. It’s still there if you turn the CSS off or if you look at the code, but it doesn’t show up.

Two questions:

  1. Is it cheating?
  2. Does this provide some sort of deep insight on how I look at the world and edit my life accordingly but allow the things to still be there under the surface?