My take on hallway testing. The disruptive sign is a hot trigger. The bulletin board is in a high traffic area.
My take on hallway testing. The disruptive sign is a hot trigger. The bulletin board is in a high traffic area.
I think the contact management feature of skedge.me is my favorite part of the application.
I like the architecture, the attention to interesting moments, the detailed interactivity and feedback.
I also like it because of the collaboration between UX and engineering. I delivered tight wires and a solid design doc. We discussed the interesting moments of the feature and filled in the holes. As it came to life we adapted to problems that came up. It set precedence for the rest of the features on the app and defined the design pattern for the administrative features of the product.
Here is a shorter version of my last post that doesn’t include 5 minutes of me talking about a UI. I replaced my voice with a drum and bass beat. Please comment if you prefer it to this one.
Here is a walk through of a feature for creating a booking calendar for a website. It incorporates a two panel grid with the primary panel used to present options and the secondary one for revealing a preview of the choices made. It shows off how to use heuristic elements, revealing options and choice feedback to guide the user through a complex task.
One of my mentors taught me when writing code, “Change ONE thing and test”. If you change more than one thing at once, then you don’t know what improved or ruined the result.
The same technique applies to making changes to your product design.
This is an example of a dynamic and responsive user interface designed to react to the direction a user takes to accomplish the goal. It changes based on the the state of the task and the amount of options that are present. Please watch the video or read on to get more of the details.
Subtle and unobtrusive animations can add a bit of polish to an application and let users know the product has a little pulse. But they can also serve the user and do more than just provide a little sizzle.
I have held a number of jobs where I established user experience as part of the software development process. In each case, it has been on small teams building big web applications.
Scheduling applications demand user interfaces where successful completion of a task is critical for both business and customer. This booking calendar widget lets customers book services or sign up for events online. It must offer clear choices, display available times and make it easy to sign up for what you are looking for. Click the image to try it out for yourself. Feel free to book.
My yoga teacher had trouble staying on time during class. She asked me to make her a way of keeping track of where we were in class. I came up with this visualization for an hour and 35 minute class. Each cone from the center represents a minute and it indicates the different sections of the class structure as it moves through time.
But it’s not just visual, it’s functional. To “use” it, I told her to keep a printed version of the graphic and align the start label with class start time on the wall clock. It will then tell you where you are or should be according to what time it was. As seen here, class starts on the half hour. I gave her a laminated one you could write notes on in wax and erase.
I was inspired by my study of Edward Tufte’s work on information density.
I was searching the web for inspiration on complex data represented in a data grid. I am working on a CRUD table design with multi level information.
I remembered my work in 2006 on an alumina trading platform that represented deals with very complex layers of data. The data had many horizontal groupings as well as nested vertical associations. Looking at it today, it holds up pretty well. The “eye candy” is a little heavy but the client loved it. If I could go back I would tone it down and beef up the information more. Keep in mind these are excel worksheets.
What I like is the summaries, and nested data and subtotals all make sense. I use color and form to guide the eye to the associations involved in the information delivered.
I never did find and good inspiration on complex table designs. I hope these are a source for someone else looking for some.
Walkthrough: Interaction design for epicurious.com
(Source: youtube.com)
Walkthrough: - Interaction design for epicurious.com - Recipe Box Feature
(Source: youtube.com)
A good example of Front-end engineering and User Experience design coming together to deliver “Big Data” to the browser.