Tag: review

Senseless waste of asterisks… Avis used an asterisk to denote optional fields. This means that there is a lot of baggage that comes with an asterixk. Somewhere this symbol got meaning, it’s not in the bible!

We can control when something goes from unintuitive to intuitive.

A design is intuitive (although technically and grammatically speaking that is false).

An intuitive design is when the user is focused on their objective.

Simplest site online; haynet, need hay and have hay. Unclear objectives.

Intuitive Design is Invisible. you only notice it when there is something wrong with it. Like the AC in the room, it’s only notices when there is a problem with it. It’s an issue of focus.

Lytro gives focus shift to the users.

We shouldn’t force users to focus on things which they don’t choose to.

Property #1 of intuitive design: Clear Focus.

Kittens die when marketing people win.

Keep focus on the users objective and not on the interface.

Magic Escalator of Acquired Knowledge: zero knowledge at bottom, full knowledge at top. Positions at current knowledge and target knowledge show a knowledge gap. To make a site intuitive we put current and target knowledge as close as possible. An intuitive design is when current knowledge = target knowledge. We can either train people to increase their current knowledge, or we can simplify the target knowledge. Teaching examples: like facebook timeline introduction, google apps update with walkthroughs. Simplify examples: craigslist, umbrella today.

Things with a large knowledge gap that we must use we tend to hate, and when use is voluntary we avoid. Things with a smaller knowledge gap and required are tolerated, and when use is voluntary we are cautious. If the knowledge gap is small enough users love it and use it! Making things usable lets users enjoy using it and they like us!

With a million visitors and a 1.6% conversion rate all purchases. 1 foot = 16,000 Visitors. The customers are the 1.6% that convert! Don’t alienate customers! Don’t destroy current users’ current knowledge, that’s like sending our best customers back down the escalator. Learning a system is an investment and people hate to relearn. Subtle changes doesn’t throw away current knowledge.

Always keep the focus on the users’ objective. Don’t distract with design changes.

Property #2: Map design to user objectives

See price in cart – on online stores is not a trick to get people to buy more. It’s a law they have to abide with thanks to the FTC.

Hipmunk flights drawn on chart and you can sort by agony. Different presentation of flight data, makes the shopping choice much more intuitive.

The medium of design is behavior.

Core skills of user experience (Intuitive): Interaction design, visual design, user research, copy writing, information architecture…

Users only see Local – local links. Users don’t pay attention to global links.

Best way to do user testing, watch people. Watch people. You find out simple and obvious things by watching users using the site.

Property #3: Forewarning

Shopping cart showing shipping before cc input is critical.

“More”, “previous” and “next” links are noise, especially when you come in at the middle. It makes everything out of context.

Pull to refresh: low target knowledge, no current knowledge. Not intuitive – socially transmitted functionality. STF.

Property #4: Understanding of Convention

Key functions enter vs shift enter, tabbing order, google apps:auto-saving.

Convention of proximity: username and password and login button should all be close together.

Understand which conventions users will expect. Techniques for understanding: filed visits, usability tests, paper prototype, Handbook of Usability Testing, Paper Prototyping.

The iPhone changed our industry in 2007: first mobile to have a desktop class web browser and it made people start using their mobile phones as computers!

All apps other than apple provided ones were web browser apps. Most of the first apps were branded web browsers. No real difference between using mobile site or mobile app.

Now companies are asking (like they did in 2000, about a website), “Do we need a website?”

Instagram has no website, just an iOS app.

web != HTML, browsers the web, the code/HTML and native interface are all current services.

When is an app not the answer: content sites, low budget, prototypes, breadth audience.
When is a website not enough: hardware access (native access comes first, javascript coming but years out), software limitations (fullscreen, background processing), data limitations (address book, calendar, media), connectivity (offline access isn’t production ready), practical size constraints.

A website is not always enough.

People are finding apps first on their device in the store and not coming from the web. Websites aren’t promoted in the app store.

Downsides: app stores are closed gate keepers. 30% commissions taken by the app store. Reviews are not respond-able and not gauged for quality or even comprehend-ability, like comments we can’t moderate. Payments.

On the web payments are hard, so we’re using ads. For apps, payment is actually easier than ads.

user-generated content – horrible phrase vs author writes a story.

Monetizations matters, considering “users” as customers we can start serving the customer rather than the ad vendors.

Apps are not inclusive, we need to develop an app for every device. And that limits the audience to those who have that device.

Design considerations, style tips: use standard controls where possible, integrate webview seamlessly,

Native to one platform you just build for that platform and don’t have to worry about browser inconsistencies.

Tips:
Mind your encoding: utf-8
When loading content set bg to transparent to avoid white flash
show a progress spinner, hide the uiwebview when remote content loads
consider disabling scrolling in secondary or minor uiwebviews
disable long-tap link menu (add value to standard behaviors)
disable text auto-resizing and text zooming
control orizontal oerflow to prevent unintended scrolling
consider advanced text rendering (carefully – t can get pretty slow)
consider auto hyphenation (small performance cost)
consider disabling data detection (phone numbers, emails, etc)
load local resources with relative file urls, or use data urls
communicating between environments – native code to webview javascript.
consider listening for gestures in js

Why does all this stuff matter?
Able to learn it one thing at a time: because things start slow and modules are added over time. It’s easier to keep up with changes than it is to learn everything.
HTML, Web Design and Apps are all in the same eco-system and there is some overlap. Best to learn more about apps NOW, as it starts than try to catch up later.

MASS MEDIA (in waves)
Print, Recordings, Cinema, Radio, Television, Internet, Mobile

Mobile is the new Mass Media

It certainly is mass and massive. More mobile devices (by far) every day than babies born on the planet. Mobile devices are eating into our personal computing shares.

New waves of mobile media eat all previous media waves. Mobile has indeed eaten all previous forms.

A new form of media always introduces new features or characteristics! Always on, portable, digital, social, augmented reality… the list goes on.

We have to recognize that the mobile is not a desktop. Our first inclinations are to copy what we did before (in the last wave). It takes a while to shed old paradigms.

StumbleUpon has been huge on mobile (as well as Kayak). They are doing a complete relaunch based on what they’ve learned on mobile.

Take what we know on the desktop web (today) and adapt it and optimize it for the mobile (today) and move forward (tomorrow).

Logins

passwords – forgotten passwords are rarely shown on mobile login pages.
Don’t remove things that are critical.
Use input and types and attributes. (autocapitalize, autocomplete)
show passwords – “Masking passwords doesn’t even increase security, but it does cost you business due to login failures.” -Jakob Nielsen
input masks
save passwords and let users login without a password (use single sign-on via: facebook, twitter…)

Set default to smarter option (like organ donors).

Adapt and optimize what we were doing yesterday and apply it to today. We can even make these things apply to yesterday!

Think to tomorrow: touch gestures, facial recognition, sms authentication
Step back and think about problems we’ve already solved. But use new techniques that have evolved since we’ve come up with the standard solutions we are regurgitation constantly without rethinking the problem. We can do much better now, but we’re so used to throwing the same solution at the same problem there is no more thinking about it. We don’t need to inherit the same issues we already have, let’s solve them by rethinking the original solution.

Why bother?
This new mobile mass media is always on, always on them and available at point of inspiration!

Checkout

3 of 4 carts were abandoned in 2011!
We should reduce effort:
Removing unnecessary questions
Keep people on the keyboard, combine fields (first name + last name = full name)
Hide irrelevant controls (until they need them)
Set input types( type=tel ) use input masks, ignore bad characters. Credit card use input-type=tel for the numberpad.
Keep people on their keys

Check out square to see the improved cc fields.

Progressive Enhancements – use what best fits the device that’s being used.

Checkout for the futures:
Contacts API, Location Detection, Self-checkout and Scanning

Korean grocery shopping in the subway! Tesco, scan qr codes and groceries are delivered automatically.

Mobile is a massive new medium! It forces us to adapt and optimize our solutions and moves us towards the future. We should push for better device apis! Let’s agitate the blockers and the bug guys: Apple and Google. PhoneGap lets us do all these things already using existing standards! Tomorrow Today.

Mobile and touch should be revolutionizing design and user experience.

We don’t want to touch a tiny link or button. Back button is just stupid. Fitz’s Law, make things fat proximal targets for easy touching.

People are lazy, let’s as designers LET people be lazy! Maybe even use the whole screen as your control.

Eliminate buttons if we can! Buttons aren’t evil, they just aren’t as relevant for touch. Gestures are the keyboard shortcuts of touch!

Big screens invite big gestures, don’t make people hit little specific buttons or links. Buttons are a HACK. Light switches are not intuitive, they are a learned behavior, an inspired hack introducing a middle man.

We don’t need an abstraction layer for uI controls. We can directly manipulate the object by touch.

The new Windows OS is leaning this way! Twitter iPad app is doing this. Rather than a back button or a UI, we just swipe our way through content.

The web sucks as coding gestures and is like the red-headed stepchild of interaction design. It trails behind proprietary technology. Flash helps bring standards, but we’re still waiting. But we can speed that process and push standards and agitating for more and better. We need to push for support for gestures (for now all we have is touchstart, touchmove and touchend: which aren’t very helpful and not widely supported).

The gesture conventions are tap and swipe. Plus there’s the emulator layer of the browser. As a community we need to figure out together what conventions there are and how to best apply them. It’s not easy to go beyone simple taps and swipes. jQuery mobile and Sencha touch are libraries that give us more events – these are really tuned with web-kit and are pretty big frameworks meant for creating html5 apps along the lines of PhoneGap. Touchy.js – more lightweight, but there are still some big holes.

http://bit.ly/ikeatouch – Direct interaction with the content itself.
http://bit.ly/ios-clear – Playing with objects as the interface.
Ipad App Touchup – lets you paint patters on images, but rather than adjusting brush size you adjust canvas size and the brush is always the size of your finger.

For mobile: clarity trumps density. The more features and controls we have, the more things get in the way. The more power we give people sometimes the more paralyzed they become. Swiss army giant pocket knife.

Gestures are invisible. So how do you find out (or instruct) about these controls – Finding what you can’t see. Create realistic user interfaces, with a little help, people will learn to work interfaces. Nearly everything has to be learned or taught: snooze alarm, qwerty keyboard. We always start with a physical reference. Social signifiers or cultural: who knows the salt vs pepper shakers? The only thing that matters is what the person that filled them thinks! Cut out the middle men and let the content be the control. Clear salt and pepper shakers! Let people interact with the content and not the buttons.

The medium is the message, The message is the medium.

Give obvious visual cues. Instructions are making things harder, nobody reads the manual!
How to use a magazine
How to use a book

It needs to become intuitive. Nature doesn’t have instructions, look at a toddler, we figure things out as we go. Use a book metaphor, but don’t break conventions. EMBRACE the metaphor! Don’t make me tap buttons if the interface makes me think otherwise. There is a digital advantage to random access navigation.

Toddlers are learning how to use iPads faster than adults. We’ve learned incorrect gestures and are not used to thinking about them. Approach apps and designs as we’re building them for children. Video games are great at teaching you how to use the interface, not with a manual, but by drawing you through the experience by:

• coaching (with active discovery) – we learn by doing. Things that move can perhaps be moved by users.
• leveling up – when you learn something, it moves on, demonstrate gradual progressive controls
• power ups – efficiencies in the hands of experts. keyboard shortcuts. achievement based unlock tools by learning

We should be generously talking to each other about how were trying to use our gestures. It’s exciting to be involved in inventing the futures of how we’ll be using tools, be involved in the discussion. Have empathy for the users.