iOS style notifications with HTML, CSS, & Javascript

image thumbnail for iOS style notifications with HTML, CSS, & Javascript

I do a lot of prototyping; sometimes for internal audiences as a bit of a sales tool to get a project off the ground, sometimes for demonstration purposes, and sometimes for user testing. Often, the final deliverable will be something written in Objective C, Java, or something I am not that familiar with, but in many cases I am able to make a fairly accurate facsimile of the final experience by using HTML, CSS, and Javascript. Recently, I was trying to display an iOS style notification in an HTML prototype, and while there are plenty of great posts on CSS transforms, I had to do a little tweaking to get the effect I wanted. Below I've outlined a few approaches that may be of some use.

Continue Reading »

Sketchy Illustrator wireframes

image thumbnail for Sketchy Illustrator wireframes

About half of my time as a UI designer goes into making application wireframes that end up in various powerpoint presentations, low-fi prototypes, GUI specs, and User Stories documents. I'm a big fan of sketchy wireframes since they have the advantage of appearing unpolished (so that users and managers do not think they are final), but they also allow the UI designer to accurately depict the application controls, available screen space, and can generally translate well to higher-fidelity designs if needed.

Continue Reading »

Older Posts >>