I have a serious problem with Google. This is a difficult statement to make, because I don’t think there is one Google. The company is so large, and spans so many interests, that to say something as vapid as “Google is evil” does not adequately portray how complex and sprawling the Google system…
(Source: mwunsch)
My buddy @ckolderup just posted a link to Poncho.io and I wanted to document this fantastic example of a great user registration experience.
Poncho.io is a free service that delivers “personalized weather reports every weekday morning, tailored to your routine, delivered by email or text.”
While i havent received any updates yet, I was blown away by the User Experience of the Registration Process and a really nice Flat Visual Design. Here are a few screenshots and the basic flow.
You either scroll down or click the bottom “Find Out How” button and the page seamlessly scrolls down to reveal the devices which you could receive the updates on.
The site itself is responsive and when you view the site from a tablet, i’m assuming that it assumes it is the device you will be receiving the updates on and changes what devices are shown.
You enter your name and click get started and the page animates up to give you a nice little introduction and asks for your zip code. Just look at that microcopy!!
After you set up your zip more animation and the site asks what time you wake up in the morning and here it get’s super slick. It when you adjust the time of day you update the color & shade of the page from bright and sunny to dark and moody.
You then follow a few more steps letting the system know if you exercise outside or need to take a pet outside all of which have smooth animations and great copy.
The next really interesting interaction is when you select you commute to work which i assume will give updates or warnings about any troubles with the trains during my commute.
When you select the Train option you are presented with all of the NYC subway lines and are allowed to select one or more option by clicking and clicking again to unselect. Great use of hover and onstates.
You then enter your leave work time and select what delivery method you want, enter and email & password and thats it, all done!
You can go in after and adjust any of the settings you’ve selected and you also can scroll up at any point and adjust any selections made previously.
I dont think i’d be far off by saying that this was certainly the product of a lean team of a talented UX designer, a Visual designer and programmer sitting in a room and hammering this product.
Excellent work and I cant wait to get some updates.
Brilliant Jquery plugin to enhance the user experience greatly. As Dan Saffer says, your product is only as good as your worst microinteraction. It’s the little things that matter folks.
bjk5:
The hover effects on Amazon’s big ‘ole “Shop by Department” mega dropdown are super fast. Look’it how quick each submenu fills in as your mouse moves down the list:
It’s instant. I got nerd sniped by this. Most dropdown menus have to include a bit of a delay when activating submenus….
Some of the best developers and designers have spent months and years crafting, and in some cases continually re-crafting, app for Twitter, striving for their versions of perfection.
Here is a great heads up comparison of twitter timeline interfaces across multiple apps.
— The American Scholar: @FranzKafka - William Deresiewicz (via justin-singer)
poignant observation
(via soxiam)
She used wood and acrylic to make five 3D objects that recreate the physical actions required to operate a touch-screen smartphone, using newspaper clippings, book pages and paper maps to represent the data being manipulated. (via Multi-Touch iPhone Gestures by Gabriele Meldaikyte)
Clear, Rise and Solar are three examples of a trend of “gesture driven” apps with a flat UI. These are novelty apps for people lusting for the very latest in app design. …
These apps have chosen to reduce details to achieve a minimal UI, but in the process the UI has also become harder to use. Unfortunately a UI walkthrough is quite an inelegant way to explain the core functionality of an app. It can be a frustrating obstacle before you can dive into an app, and you have to remember all of those new ways of using it once you get in.
I agree that the more subtle approach is usually the best for slightly hidden or ou of place features but when you try to push the boundaries of touch based interactions and not include some tutorial or walkthrough, you run the risk of fatally slow discovery of features. Max also states that when you move to a minimal UI you reduce details, to which I disagree.
You can certainly achieve a minimal UI without reducing details. have a look at Check The Weather app on iOS which does an amazing job of packing in nothing but details combined with a minimal UI. They are a gesture based system which has a UI walkthrough hidden in the help menu.
When it comes to teaching users to use your UIs, I would recommend to do so mainly by progressive disclosure with slight visual cues and subtle animations - only use a walkthrough as a final resort.
If you app is complex and deep or an entirely new “system”, taking the suggested approach would result in constantly bombarding the user with moving elements which hint at hidden features. Imagine if Check the Weather Had all of its hidden features pop up and down to ‘remind you’ they are there.
In Max’s own app example, he uses the subtle visual cue approach to basically tell the user “Hey, The Ingredient List which is usually the first thing you see on a recipe card is actually hidden on this piece of paper which we are making you swipe over to find” This works well because the user is probably looking for the ingredient list to begin with and seeing the paper slide in is a good visual cue. That whole interaction seems unnecessary to me but the visual cue works fine.
In summary, I agree that when you are providing access to features or options, using slight visual cues are a good idea, but would be ridiculous in practice when all of your “gesture based” app’s features are hidden and you are attempting to achieve a minimal UI. I think that a better approach for these more deep and more complex systems which attempt a minimal UI would be a UI walkthrough within the help system.
This is one of the most amazing mixes of amazingly executed technology and story telling i’ve ever seen. The use of animated GIFS is extremely well done and makes for a compelling way to progress through the experience.
I don’t have much experience with rich HTML5 based ebooks, but if they work as well as this and provide as much engagement and payoff they have a brite future indeed.
Looking better does not equal better functioning.
Just a minute ago I did not have blog, but just now I read an article featured on Hacker News, written by Chris Norström and titled: “Invention: Multiple-Choice “Windowed Slider” UI” . I wanted to reply in a comment because I do not agree with Chris. While typing my comment, I realised it…
Great analysis of what seems on the surface to be a clever UI design. In truth the idea is too vague to be applied to such different set of control elements and doesn’t hold up.
