“Come See Our Latest Creation”, says Apple’s invitation to the presses.

Above is an exercise I did to create the new Apple iSlate product based on the allegedly leaked specs seen below (I’m not sure if their real or not but who knows, they sound good though). The specs state that this iSlate will project as well, that’s pretty sweet considering how small it is - plus it’ll be handy for educators to use (instructors, teachers, small businesses, etc).

UPDATE: Well the iPad was released. But what a horrible name, iBook or iTabet would have been better - it sounds too close to a tampon title. Anyways, this was a fun exercise to do - even though when it was released it was a bit bigger than I anticipated and with a lot less “gadgets” than I thought (it still needs a camera).

Follow me on Twitter if you’d like.

Really my response differs depending who I’m talking to.

A general response that I give to this question is:

This is usually followed with a blank stare by the person who asked, as if I lived in the matrix or some shit. If I get this reaction, I follow up and say it’s a different form of graphic design, but for the web. People usually respond well to that, with a “Cool.” or a “Sweet.” If they do relate, I break it down a little further for context.

So, with you being in the field user experience, it’s only been around for a little while, right, ever since computers have been around? Wrong. Think of it like this, some form of user experience was put into everything you use every day. From your car to the TV remote, those devices have gone through countless hours of mapping, planning, concepting, testing, etc. to make a quality product that you can benefit from and easily use in whatever tasks that device does for you.

Using this same concept in the context of software and the web, user experience design plays a HUGE role in creating cohesive products for users shown by enhancing content by purpose, flow, layout, aesthetics, and making any relatively challenging functional goals intuitive. Your providing a service for users and if you succeed in doing all this, the user will be back because it works and if not, they’ll use something else that provides that same service better.

Anyways that’s my little rant about user experience design.

Below are some great articles on this same topic:

> Understanding Web Design by Jeffrey Zeldman
> Exactly what is “User Experience Design,” anyway? by Kevin Mattice

Follow me on Twitter if you’d like.

In this post I’ll go through some of the steps I went through to make this site. I started 3 weeks ago (or so) and finished it today (11/21). Granted this is only a web site, but like any user center design process, it all starts with purpose, “what” content goes “where”, “why”, and then during wire framing, the “how” is answered.

Below are some thoughts I had about where content should go, just organizing:

WIRE FRAMING & CONTENT
After this I flushed out the wire frames a little more, trying to nail down actual sizes to mark how big the content will end up being and to work some layout issues (flows) I was having on how people would experience different sections. During wire framing I was gathering content at the same time - since this took a while, it gave me time to plan based on the types of media I was finding: images, swf’s, flv’s, etc.

Below is some early wire framing:

DESIGN
I went through 4 different concepts before liking a direction. Simply enough it was all based on color and the idea of there being ribbons or bands to signify the different sections of the site. I liked it and I went for it - I would describe it as a clean grunge, not too clean, but grungy enough to call it dirty, ha.

Below is the fourth concept I went with, I built it out a little more than what you see here obviously.

BEHAVIORS
Before coding everything together I read up on HTML 5 and thought that it’s just too early for it to be supported fully, but I did take the same architecture approach (articles, sections, etc.) and scaled everything back to div’s. Everything was based on standards and compliance, I wanted to keep everything very clean - I ended up coding everything in XHTML, CSS 2.1 (using 3.0’s text-shadow), but overall nothing fancy. For a JavaScript Library I used JQuery. For viewing portfolio work I used Shadowbox and modified it to fit what I needed it to do. LazyLoad for all linked images and various other JQuery behaviors.

Finally I wanted a strong CMS to manage everything. I used Expression Engine, as far as I’m concerned it’s the best! As long as you watch the videos and read the documentation it’s easy, there is a ton of support you can find, and as long as you plug in complaint code it’ll kick out complaint code, which was a plus for me.

Anyways that’s it, take a look around and try to break stuff, ha…

Now that I have a home to type too, stay turned. I’ll be posting tutorials, movie reviews, news, family stuff, and other random stuff.

Follow me on Twitter if you’d like.