A Better Way

Finding a better way to get things done, a technical journey

Posts Tagged user interface

HTML5 Site – Waterford Family Bowl (Part 1 of n)

Apr 3

Posted by Jack Lawson in Analytics, Architecture, Development, JQuery, Javascript, PHP, User Interface Design, Web Design, Web Standards, css | No Comments

Waterford Family Bowl website

Waterford Family Bowl website (www.waterfordfamilybowl.com)

A little while ago, my aunt approached me- she needed a website for her bowling alley. “Sure,” I said. “Let’s go over what you want and we’ll build something that works for you.”  In the back of my mind, I was thinking “awesome! Perfect timing to flex my HTML5 muscles and try jQuery 1.4 in a production environment; will it work?”

The site’s now completed, and in production. Go ahead and check it out at http://www.waterfordfamilybowl.com (still waiting on a little alternate content :) ). I’m going to, over a series of 4 or 5 posts, go over how the site works- how and why I used PHP, jQuery, HTML 5, jQuery, WordPress, Picasa, Google Analytics and Webmaster tools, and Google Apps; and, how I merged them all to create a dynamic, easy to use and easy to edit website. I used principles from books like “The Design of Everyday Things” and “Don’t Make Me Think”, and I’ll explain how and where these came into play.   The process I took made even IE 6 compatibility a breeze!

Brief overview on how I plan to break it down:

1. Intro to series
2. Design - architecturally and graphically
3. Implementation of WordPress, Picasa, etc.
4. “Contact Us”, finishing touches
5. Google Analytics and Google Webmaster Tools overviews
6. Wrap-up (maybe?)

Reblog this post [with Zemanta]

Tags: , , , , , , , , , , , ,

Don’t Make Me Think: Book Review Part 2

Jan 19

Posted by Jack Lawson in Book Review, User Interface Design | No Comments

Nice example from the Don Norman school of tho...

Image by padday via Flickr

The first section of the book, called “Guiding Principles”, lays the foundation to begin thinking about usability. It explains the thought process that the end user takes; it’s never what you plan, but with proper design, you can help guide and funnel them in the right direction.

I’ve explained it in another post before: developers often think exactly like their application: we think, “if the user clicks X, they’ll see a menu for Y, which they can click to get to Z. Wire it up!” but in reality, the user isn’t a developer and doesn’t know the application end-to end. They have to muddle their way through the website, and if they’re lucky, they’ll manage to follow your carefully laid track. The only way we can have a hope to get them from X->Y->Z is by making each link, button, or step as clear as possible by developing controls that are self-explanatory in use. Buttons should look clickable, links should stand out from the text, headers should be obvious, and navigation should be clear. The user shouldn’t have to look up help text, experiment, or even pause to think in their quest to get to Z.

In other words, if you think, “we’ll just add explanatory text right here,” You’re Doing It Wrong.
Stay tuned for Part 3!
Part 1

Tags: , ,

Don’t Make Me Think: Book Review Part 1

Jan 14

Posted by Jack Lawson in Book Review, User Interface Design, Web Design | No Comments

Cover of

Cover via Amazon

After a 4-month break in which I was too busy getting ready for, delivering, and caring for our second child (Penelope Rose- November 16, 2009), I return!

I’ve had some pretty strange and interesting things go on in the meantime. The first of which that I will relay on to you will be some thoughts on the fantastic book “Don’t Make Me Think” by the brilliant Steve Krug.

I used to think of usability like it was some horrible sea monster, constraining design and getting in the way of just plain moving forward. But then some space ray hit a neuron in my brain, and suddenly I was interested in usability. “Can you develop fast, beautifully, and usable? Is it all about plain blue underlined links, and Times New Roman, or is usability something else?”

My first stop was another excellent book, The Design of Everyday Things by Donald A. Norman. I started with this much heavier book when I saw it on Jeff Atwood‘s reading list; it’s a more general book that covers design everywhere, whether industrial design, architecture, interface design… it was about the obvious dos and don’ts. I think that even though it was a heavier book, if I did it again I’d still start with it. It explains very well that usability isn’t about killing desig- it’s about making design accessible.

Then, one day when I was browsing around Barnes and Nobles (my wife in the children’s section, me in the computer), I saw in big letters “Don’t Make Me Think.” Having recently finished helping redesign several key areas of our website, all because these specific areas were a little rocky to use, I was intrigued. So, I picked it up… and two hours later, the store started to close while I was leafing through mid-book, my Peppermint Mocha congealed and cold.

There are two key points to Don’t Make Me Think that make it a joy to read: it’s brevity and bluntness, and it’s humor. It’s less than 200 pages, and the entire book could be read in a 4-hour sitting; but the wealth of information contained within it will impact for a lifetime.  I’ll be posting more over the coming weeks pertaining to specific chapters and sections of the book. Yay Usability!

Reblog this post [with Zemanta]

Tags: , ,

On Boating

Sep 23

Posted by Jack Lawson in User Interface Design, Web Design | No Comments

An aircraft carrier is incredibly secure; it’s safe, it’s backed by the government, it’s got infrastructure and it’s built to last.

But everyone still wants to ride the luxury yacht.

Tags:

When Does a Framework Become a Language?

May 26

Posted by Jack Lawson in Development, General, Javascript, User Interface Design | No Comments

Kleenex logo
Image via Wikipedia
A friend of mine posed this question a few days ago: at what point does a framework become ubiquitous enough to be a language on its own?
This came after a brief discussion about jQuery, where the point was made that we hardly ever use traditional, raw Javascript anymore. We use jQuery to write the core of our applications,  jQuery to do UI effects, jQuery for validation. We hardly ever even use the word Javascript. But, the question he posed is, is jQuery the same thing as Javascript? Is it different enough to be considered something else, or should it just be considered a framework – the same way .NET is a framework to C#, or Rails is a framework to Ruby?
Our conversation came down to semantics. The same way we (or at least I) call tissues not by tissues, but by Kleenex, or the way Texans call soda “Coke”, and although jQuery does not (in a technical sense) replace  Javascript (rather, extending it), perhaps it is simply cognitive recognition that presses us to call anything Javascript related jQuery. Someday, will everyone call Javascript by jQuery? It very well could be.  We’re still not calling it ECMAScript.
Reblog this post [with Zemanta]

Tags: , , ,