Joshua Tucker's avatar

Joshua Tucker

Usability is a 360 Degree Spectrum

The heart of usability goes after the user. From a user interaction standpoint, the purpose of such design is to enhance the environment allowing each and every user to experience it in a simple, native, and unique way. To accomplish this, problems must be solved. Just a like a developer solves a problem through code, a usability designer solves a problem through design and interaction. 

I’m writing this post as I feel its important to stress that to accomplish excellent usability, you have to approach the environment taking in a 360 degree view. What I mean by this is, many times developers and (or) designers bring out this great awesome new feature or interface but don’t account for the other existing factors that are inadvertently “removed” or “hindered from use” due to how the implementation is done. Also, solving one problem doesn’t mean you solve them all. Introducing something new is great but can cause problems in the interaction itself by offering a limited field of usability. 

I’m going to use the following example to illustrate my thoughts and conclude with how I feel this scenario applies. 

——————————————————————

Search Engines in Safari for iOS versus Search Engines in Safari for OS X

Safari on OS X has had a slick feature for a while that allows the user to change the default search engine right from the search field. Now that Safari has a unibar designed (part of Mountain Lion), it’s now done through the address bar. When the URL field is empty, a magnifying glass will appear on the far left. Clicking it will drop down a small window and give you an option to switch to another search engine in the list. Clicking a new search engine will change the default search engine. The default search engine can also be set in Safari’s preferences.

With the way OS X has it set up, it would be easy to gradually add new search engines to choose from because they are easily accessible from anywhere. Even though a user may switch often, it’s excellent usability to allow the user to switch at anytime without going through dialog windows, settings, or by doing numerous steps. Convenience is key.

On iOS, it’s much different. The way you can switch search engines is to go into Settings > Safari > Search Engine and change it. And technically, by doing this you’re doing two different things. First, you’re changing the default browser. Second, you’re changing the search engine you wish to use in a session if you’re currently browsing. What I mean by this is, if I want to switch to searching Bing in my session from the search field, I’d have to switch my default engine in Settings so that I can. The way iOS has it setup would make it extremely difficult to continue adding more search engines because it’s difficult for the user to switch them quickly within the current view. Again, convenience is key. Having the ability to switch search engines from within Safari is key.

When it comes to searching the web, I feel that it’s extremely important to have “liquid methods;” actions and tasks that can be done dynamically right where you are without having to pull yourself away from the current view. Switching search engines I think is one of them. OS X has got this covered, so how could iOS improve? Here’s my solution. Give Safari in iOS a unibar design. Offer the magnifying glass icon on the far left and allow the user to switch simultaneously right in Safari without having to go into Settings to switch it so it can be done natively within the address bar.

——————————————————————

So the natural follow-up question would be "how does the scenario above apply to a 360 degree view of usability (or initially the point of this post)?" This scenario gives an example of offering a feature that may not necessarily be "user-friendly" in all cases. The problem being solved was the fact that users need a default search engine option. The solution was offering a way to offer a setting to set the default search engine. But, to my point about a continued 360 degree spectrum, another problem arose. The next logical step became "I’ve given them more than one option for a search engine but what about when they want to switch search engines easily?" OS X allowed the user to switch dynamically. iOS hasn’t followed in its footsteps yet.

Problem solving is a process. Solving one problem doesn’t solve them all. When thinking of usability and interaction design, remember that it is on a 360 degree spectrum. Features, actions, methods, and tasks all loop around and interconnect with one another. To be cliche, the quote the expresses it in the most down-to-earth way would be “What goes around comes around.” So when introducing something new or changing something existing, take this approach and look from a bird’s eye view of how your project, application, or tweak will offer something unique as well as how it will potentially shift how other things work. Follow the trail all the way around making sure each step of the process is simple and user intuitive. And when you reach the other side back to where you started, you know you’ve created something amazing.

© 2012 Joshua Tucker

Introduction

Based on the pictures above, I have proposed the following:

The main page of the Mail interface should be arranged in a hierarchal fashion. Inboxes can collapse and reveal folders within them, thus removing the need for an “Accounts” section. The space left empty due to the unification could be allocated for something such as an RSS inbox.

Note: I do not claim to be an expert or master on this subject. I’m still learning and eager for feedback. What has been written is based on my own personal analysis which includes my experience in this field.


Analysis

I rest my concept on principle number nine from the book 100 Things Every Designer Needs to Know About People by Susan Weinschenk

People believe that things that are close together belong together

As such, if the user feels that a component is connected to the main branch, they will understand its purpose in the interface scheme. This establishes familiar gestures, methods, or other types of user-initiated actions for more then just one part of a page.

One argument, that I would suggest to you, is that Apple’s aim is to unify iOS and OS X to make one single OS for the betterment of all devices. Although there may be no disagreement, this plays a significant role in how to move forward in both systems.

For a moment, let’s briefly evaluate how the Mac handles mail in the way I’ve proposed it for iOS.

  • Inboxes are ordered in a hierarchal fashion
  • These inboxes can reveal and hide folders based on clicking
  • Whether hidden or in view, there’s a connection between what folders are with which respective inbox or folder (depending on how deep folders go)

In the name of unity, I would propose that this functionality could be beneficial in iOS. Tapping the inbox icons would reveal or hide certain sections, as distinguished by an arrow to alert you to whether it’s open or closed. Because each section would fall under its associated folder or inbox, the user would understand its connection and could more easily navigate through the various folders; a supporting factor to Weinschenk’s ninth principle.

This would relieve the “Accounts” section giving space for something else. Whatever that may be, in this case an RSS inbox. To prop up my thinking on this matter, I once again direct you to OS X to see what it holds.

Jumping to Mail once again, let’s head to Preferences. In this pane in regards to Accounts, we find the following.

  • The Accounts section lists accounts that are added and are in the Mail application
  • In this section, the settings of the accounts or inboxes can be changed and (or) updated
  • There is no connection to actual folders or organization of them in any way

How does this play out in iOS? I would suggest that this mindset might throw off the user when using Mail. A new user could be confused by the notion of an “Account” section, where in the OS X example, only deals with settings and configurations.

When it comes to existing users, I feel that compartmentalizing sections and unifying components not only allows for better organization and gains space, but it moves parts forward to bring a unique but similar experience between all devices.

As for RSS, I chose this feature for the following reasons:

  • It promotes unification with OS X and its functionalities
  • Coming into one collaborate area is better for reading and dealing with notifications

One might argue that RSS should go into a separate application or in the Newsstand. I don’t disagree with having a different application, although for simple and easy RSS reading and managing, I don’t feel there’s a need.

Newsstand on the other hand, I don’t feel is the right place. The reason for this is because RSS is not just news. On that simple basis, it doesn’t fit. Also, RSS is generally just text and comes in as such. Because Mail doesn’t preview images and only shows them as attachments, keeping the feeds that work and perform similarly gives this sense of belonging or a reason to why it should be there versus another place.

Note: Adding favicon support is possible, however the icons would have to be sized correctly to fit the specifications (most favicons would be too small and would look distorted if stretched to size).

Also, RSS is not necessarily an end-game feature. This is an example of a possible addition.


Evaluation

Here’s a list of functionalities this incorporation could or would have.

  • Unified inboxes and folders
  • Collapsable sections - tapping the arrowed inboxes or folders reveal or hide them
  • An RSS inbox

All iOS devices would support this feature.

Conclusion

"There is nothing wrong with change, if it is in the right direction." - Winston Churchill

-Josh

© 2012 Joshua Tucker

Embrace change or become a Design-O-Saur.

Von Glitschka 

Earlier this morning, I posted an idea for scrolling text on iOS notification banners. I made note of the fact that the lock screen is a viable place for this implementation as well. However, there are two significant differences between lock screen notifications and the banners.

  • Notifications on the lock screen do not clear until the device is unlocked
  • Lock screen alerts show more than one line of text. 

With this in mind, I feel the best way to go about scrolling in this view is to do it like native iOS - vertically. 

In this post, I will be discussing my thoughts on how to go about this when in the bubble view. 

Note: All measurements are rounded to the nearest whole pixel.




Analysis

Here are some important figures to note:

Number of Characters Visible (Unexpanded) = 130 (including whitespace)

Full Size Bubble Dimensions (Unexpanded - Max Characters) = 262 pixels by 592 pixels




Evaluation

I find that the best way to alert the user that the bubble is selected for scrolling is by expanding it. This can be done by simply tapping it. Upon tapping it once, it will expand and show more text (three new lines). However, if you scroll your finger through the bubble, you can move up and down through the message. To exit the selected bubble view, tap it again and it will resize.

Note: The scrolling bar on the side of the bubble in the picture is only viewable when you scroll (just like native iOS). 

Here are some more important figures to note:

Number of Characters Visible (Expanded) = 225 (includes white space - scrolling allows the user to view the entire message thus making it an infinite amount of characters that can be viewed) 

Full Size Bubble Dimensions (Expanded - Max Characters) = 297 pixels by 592 pixels. 

The reason why I chose it to be these dimensions and allow three new lines is because, if resized evenly, it expands just a tiny bit but allows three more lines of text. It will look clean and still won’t completely cover the screen. Plus, the importance of the expansion is to alert the user that they can scroll in this view. Making it any larger would surely make the bubble obtrusive in my opinion.




Conclusion

As all the core information is above, here’s the full message I sent myself.

"Tap to select the bubble. It will expand at that point and will allow you to scroll through the message from top to bottom and back again. Tap the bubble again to bring it back to normal. This will still allow full compatibility with Abstergo."

-Josh

UPDATE

This concept has been brought to life. Check out my project Reveal with Conrad Kramer on Cydia today! Watch this video to see how Reveal works. 

© 2012 Joshua Tucker