Weather application details

Another critique of the current weather application (one that I believe can be rectified once the SDK comes out in February): more detail is difficult to obtain. For instance, most standard weather displays (TV, newspaper, etc.) give the chance of precipitation and the humidity level. This information could easily fit on the weather screen, but it isn't there. If I click on the Y! logo at the bottom left, it takes me to a Yahoo mobile page that shows ads and no additional details about the weather (plenty of other random info about my area though...).

On a side note... I have been confused as to why the calendar on the home screen updates with the current date but the weather app always shows Sunny and 73 deg F, and the clock is always at 10:15. Why can't those be updating as well?

Here's to creating more interfaces with less administrative debris!

-- Eliot Landrum (email), January 24, 2008

Response to Interface design and the iPhone

Now that higher-density displays are becoming available, both in computer monitors and in handheld devices like the iPhone, the big question becomes what to do with the extra pixels?

Tufte seems to propose to add more detail to increase value to the user. Apple seems to use more pixels for more readable fonts and higher-resolution icons. I think it is a matter of preference and we should leave the choice to the user.

A idea for better user interfaces from Jef Raskin comes to my mind again: a zooming interface. Safari on the iPhone already lets the user zoom in and zoom out to the for the user relevant information. Raskin's ZoomWorld makes this concept more universally available for all data in a computer/handheld device.

In my Palm that has a similar screen (resolution and density) as the iPhone, I have longed for a zooming interface. Wish Raskin was still around to drive and promote the development of this concept.

-- Marcel van Oosterwijk (email), January 24, 2008

Response to Interface design and the iPhone

WEATHER APPLICATION

It may be worth cross referencing the ASK E.T.Weather Icons thread.
The comments concerning the high and low temperatures remind me of an
image put together in 2005.




It would seem that this would lend itself to the iPhone scrolling interface.

WORLD CLOCK

It is also curious that the there are no linkages between the
weather and the local time. If the Weather Application gives me the
current temperature, I would quite like to know what time it is, or
when the data point was measured. At present it simply shows a
sun or a moon.

-- Tchad (email), January 24, 2008

Response to Interface design and the iPhone

ET -

Your reflections on the iPhone could not be more timely for me personally: my team has been wrestling to articulate to ourselves WHAT about the iPhone challenges us to break out of standard mobile-device GUI canons as we work on the product we're creating, and it's precisely what you call out: the felt naturalness of interfaces that convey information and options for action adjacent in space rather than stacked in time.

What do you see as the primary PITFALLS of the enthusiasm so many of us are feeling now at the promise of being able to develop mobile applications that SLIDE into the user's attention what's relevant when it's relevant rather than the user's having to DRILL for that information?

-- mumbles (email), January 24, 2008

Response to Interface design and the iPhone

Love the networks your particular iPhone is able to "connect" to. Now a question ET: was this your cuteness or Andrei's?

I'm particularly impressed you are the first one to use "channel 51, et. al" to connect with such high quality!

;-)

• UHF.png

-- Jeffrey Rutzky (email), January 30, 2008

Response to Interface design and the iPhone

The interface design of the iPhone is great. Your video says the weather display is a good page to show off your iPhone.

To explain the negatives of my switch from a Palm to an iPhone, I tell people that the iPhone can show videos, but it doesn't have a to-do list. The Palm 650 now looks to me like a little computer with a phone added on. The iPhone looks like a communications and entertainment device, with weak or non-existent productivity tools. I miss my spreadsheet, database, math programs, etc. However, I am happy to have made the switch, since the simpler set of programs makes for a more reliable system.

How would you design a to-do list for a iPhone? What could have been the thinking that led to not synchronizing with the to-do list in iCalc? Are to-do lists too mundane for the cool design?

Personally, I now use a workaround of untimed events for a small number of todos. There is an advantage to this method which is that it keeps me from putting too many items on the list since it is such an awkward system, in particular a long list of untimed events covers up way too much of the screen of a daily calendar.

-- Phil Straus (email), February 1, 2008

More iPhone sparklines

Thanks to the Safari browser on the iPhone, those who miss sparklines may take comfort in visiting http://www.bissantz.com/sparklines/deltalife.asp.

-- Nicolas Bissantz (email), February 3, 2008

Taking the weather app one step further

I love the notion of adding clarity by adding detail. Looking specifically at E.T.'s rendition of the weather app, I thought it could be taken one step further. The superfluous graphics have been removed and clarifying detail has been added, but I think some more care could be taken to make the interface a little more pleasing.

Here's my crack at it. Would be interested in hearing other's thoughts.

-- Matt Donovan (email), February 21, 2008

No wonder cellphone interfaces have been inept

Interface design mumbo-jumbo ("neural networks," "need states") at

http://www.eetimes.com/news/latest/showArticle.jhtml?articleID=206504012

-- ET, February 22, 2008

Admin debris follow-up

Ryan Tomayko helpfully extends the discussion of screen-hogging computer administrative debris here.

Unlike chartjunk and PPhluff, at least admin debris sometimes does something by showing commands, giving instructions, surfacing tool palettes. But too often admin debris is just bad design, show-off features, and bloatware design. This was the case even back in the early days of screen design. Screens in DOS could show 24 lines of alphanumeric information; often 12 lines were devoted to admin debris and 12 lines to the viewer's data. This unfortunate tradition carried over to the GUI Windows world. Finally, after DOS and GUI, the iPhone platform demonstrates that there can be lots of functionally without deeply hierarchical screen-trivia and without admin debris. It took a long time to get the point.

-- Edward Tufte, April 13, 2008

Response to critics

For the iPhone video, we hacked into the network ID field on our iPhone and put in the names of fast networks that are nonexistent or not available in the slow-network United States. Thus "ET 3G," "WiMax," "700 MHz," and "DoCoMo" as shown above .

This idea of this prank was (1) to make a little joke about the very slow AT&T Edge network in comparison to fast networks, (2) to indicate that our iPhone redesigns are for fast networks, and (3) to see if our viewers of the iPhone video figured out (1) and (2). All this turned out to be pretty much an insider joke. (In 200 people at Google who watched the video, about 5% raised their hand when I asked if they noticed anything special about the iPhone network shown in the video. This reminded me of the amazing video of the moving basketballs and the gorilla.)

Our comment thread on the iPhone video thread received a a number of earnest, detailed critiques. Some of these comments were based on the false premise that the iPhone was forever stuck on a standard US telco slow network--and on the unfortunate premise that iPhone users are as dumb as the Edge network. (None of the critics looked carefully enough at the video to spot the hacked network markings and none got the point about designing for high-speed networks.)

Several of the critiques began with a user model that described users as superficial, impatient, and inefficient managers of information. What users are impatient about is low-content throughput and space-hogging admin debris, commercials, and lousy interface design. Several critiques relied on a concealed version of the irrelevant Magical Number +/-7 notion.

Well, I don't do Lowest Common Denominator Design.

Lowest Common Denominator Design is a sure road to dumbed-down, content-deprived, interfaces that feature themselves. LCDD is based, at its heart, on contempt for users and for content.

Instead, assume that users are smarter about the content at hand than interface designers. Such is often empirically the case; thus the best that design usually can do is to get out of the way and at least do no harm. More can be expected only at the very highest level, such as Apple.

-- Edward Tufte, June 5, 2008

Cellphone design in Japan: inaccessible great features

http://www.wired.com/gadgets/wireless/news/2008/06/japan_phones

-- Edward Tufte, June 7, 2008

Dashboards on the iPhone

The iPhone with his high resolution screen seems to be the a nice device for delivering interactive sparkline dashboards.

-- Andreas Lipphardt (email), June 13, 2008

Interface design and the iPhone 3G

A new video describing the iPhone 3G has been
posted to the Apple website.

http://www.apple.com/iphone/guidedtour/

Note the subtle reference to the golden ratio

-- Tchad (email), July 1, 2008

New York Times story

John Markoff visits the iPhone and this thread today in the Times here.

-- Edward Tufte, July 13, 2008

iPhone as a platform

Brad Stone in the NYTimes here:

http://bits.blogs.nytimes.com/2008/03/18/iphone-users-are-mobile-web-junkies/

-- Edward Tufte, July 25, 2008

Hi Prof. Tufte,

Regarding the iPhone mobile "gesture" interface there is already a desktop equivalent called the "surface computing" interface.

Information and demo videos can be found here: http://www.microsoft.com/surface/index.html

I believe several of these surface computing machines are already in hotel lobbies like the Rio in Las Vegas.

The desktop version of the "gesture" interface or "surface computing" interface can do a lot more than the mobile version because it incorporates blue tooth technology so you can set a blue tooth device down on the surface and the computer will begin to communicate with it to perform tasks such as synchronizing files, playing music, launching corresponding content etc.

I tend to agree with you that these gesture / touch screen interfaces are the wave of the future but at the present time, a surface computer costs about $15,000. When the prices come down on these fancy touch screen machines to what ordinary people can reasonably afford, then I think you will see software applications begin to move toward this type of U.I.

Thank You.

Alex L.

-- Alex Lancaster (email), August 20, 2008

I am a bit perplexed by the Microsoft Surface. It's a stark contrast to the iPhone, which was designed from the start using the mantra that form follows function. Almost everything that Apple displays on the iPhone is functional, as evidenced by ET's video above and Apple's demonstrations.

The Surface demos, meanwhile, depict a technology seemingly in search of a purpose. The intro video features primitive drawing and moving blocks and pictures around--all things that humans are capable of doing at a very early age. I was waiting for something in that video to grab my attention and demonstrate the value of the technology. Instead, they showed stock people experiencing nothing but vapid pleasure.

When they scaled up the iPhone to a $15,000 device, I'd think that they could at least have come up with a demonstration that shows it being at least as useful as an iPhone, rather than show off the MS Paint of the future. (The fact that people even use the MS Paint of today is beyond me; I've seen students draw sketches that purport to be engineering diagrams in Paint. Maybe the Paint User's Group is their target market?)

Lastly, a surface computer doesn't have to be $15,000. A device that's, say, 4 times the size of the iPhone could be at least as capable as a desktop computer, yet would certainly be possible at affordable price point. It's almost as if Microsoft priced the Surface outside of reach so that nobody will buy it, lest they realize that it's just a $15,000 coffee table. The fact that it's most visible appearances are in hotel lobbies makes me think that it's something out of Las Vegas: glitzy but useless.

-- Michael Belisle (email), August 21, 2008

I very much enjoyed Prof. Tufte's read of the iPhone interface and would be interested in reading his take on Google's Chrome browser which was just released today.

It seems like Apple, Google, Mozilla (their new launch of Firefox 3) are all scrambling to increase the ease of use of their products. I think one of the drawbacks with the focus on how an app is used is the that the products seem to create a preference for operation versus displaying the richness of the content inside the applications.

Mozilla's new Firefox (v3) has a great feature they call full zoom - which allows you to effortlessly increase an entire web page without corrupting presentation style. Google's Chrome allows you to create application shortcuts that will then open the app outside of a browser... which is pretty cheeky of Google to have an application called Chrome that shows, potentially, no chrome.

If all the common browsers shared these and similar features then the applications could focus more on the painting and less on the frame.

-- Cody Dennison (email), September 2, 2008

One of the biggest issues I have with the design of the iPhone is the lack of a hardware toggle-switch, perhaps on the left side of the device that would allow me to scroll without using my thumb. The reason is this - I can read and process a page of information faster than I can remove my thumb from the screen. For applications like the Weather or the Stock app, this is not an issue. But with the NY Times app, or any application that contains several sceens of text I find myself annoyed, constantly trying to "read through my thumb". The screen resolution can push the limits of technology, but it can't let me read text through skin and bone. I've never read anything about this phenomenon, although I have mentioned it to several friends who have damned me because it now bugs them also.

The iPhone is a revolutionary interface, but we've got to find a way to get our thumb out of the way.

-- Keith P. Luke (email), November 18, 2008

Avoiding an interface for an interface

The iPhone platform provides a rich quick smart interface that explains itself. Thus the paper manual accompanying the device beomes a pleasant joke, a few pages.

Similarly, a flat interface eliminates the false friends of help screens, the conventional repackaging and fixing up of lamely designed product in the users manual. For the same feature set, the bigger the manual, the more poorly designed is the interface. Good, usable features should explain themselves.

-- Edward Tufte, December 21, 2008

Sparklines are shown here as a generalized display mechanism which works on any Smartphone, Blackberry or iPhone 2G/3G. More details at http://www.transpara.com.

Best Regards,

Michael Saucier

-- Michael Saucier (email), January 6, 2009

Prof. Tufte - I greatly enjoyed your talk today in Houston, and I wanted to pass on a tip that you and others reading this thread may find useful.

You mentioned while you played the iPhone critique video that the navigation bar being ever-present in MobileSafari was a huge design flaw. I agree. And apparently Apple agreed--they've actually included an html tag that allows one to remove the navigation bar as long as the webapp supports it.

This method does require 1) that the website has enabled the flag on the serverside and 2) that you actually add the bookmark to your homescreen. So it is not ideal, but I have documented a workaround that should alleviate the first problem, thus allowing an iPhone user to enable fullscreen mode themselves for frequently visited websites.

Thanks much for a great presentation!

-- Matt S. (email), January 28, 2009

Do you think it would make more sense if the iPhone interface were upside-down?

In my opinion it is difficult, when using the iPhone one-handed to reach the button when it is at the bottom. I think it would be much easier to reach if it were at the top.

Similarly, would it not make better sense for the menu icons that appear at the bottom of the screen to appear at the bottom of the screen?

-- Antoin O Lachtnain (email), February 15, 2009

Admin and marketing debris: MapQuest vs. Google maps

Excellent essay by John McKinley, comparing interfaces of MapQuest and Google Maps.

Google Maps is about, of all things, maps.

-- Edward Tufte, February 18, 2009

Back in February last year you kindly allowed my note about an iPhone beta web app to be shown here, and it resulted in some nice feedback. Thanks! :)

Out of that little beta we finally made an iPhone app (iTunes Store link), so I just thought I'd share where our design ended up. As I mentioned before, it's a bit intimidating to post work here, but since you we're kind enough to allow our first little thoughts here, I thought it's only fair to share where it ended up (so far).

A couple of things I like are (a) the almanac data for today on the left, so I can see the forecast temperatures relative to what's normal, and (b) the sunrise/sunset bar graphic to give a fast sense of amount of sunlight. It makes you feel for our friends in Barrow, AK. :)

Anyway, thanks again.

-- Ken Martin (email), April 9, 2009

In the Weather Icons thread, we looked at the number of data points per day
as a way of understanding the trend. In one of the mock-ups, each day had 24 pixels
of width and a data point for each pixel. Midnight is shown as a white pixel on the baseline.
Sunrise and sunset, or at least daylight, might also be useful layered on this sparkline.




* Facts are shown as black data points.
* Current Temperature as the Red dot.
* Predictions are shown as grey to indicate a certain fuzziness about the data.

Note - the current time and current temperature are shown on the screen with the name of the location
in question. The need to switch between the clock application and the weather application
is a limitation in the default iPhone applications.

From an interface design perspective, tapping on a day would be a great way to
zoom into the detail of the curve and data points - perhaps you have more than one
per point per hour data or information like wind speeds or precipitation that could be shown
as a sparkline. Likewise, it would be interesting to see several of these weather
sparklines on the same page for different locations.

The Weather Icons thread may be another useful source of information on this topic.

For ease of reference:

Weather Icons
http://www.edwardtufte.com/bboard/q-and-a-fetch-msg?msg_id=0001o6

-- Tchad (email), April 12, 2009

Hi Folks-

I'm an independent iphone app developer and PhD student.

My partner and I have been developing an iphone app that makes sparklines. We can imagine many uses for this, but decided to start with something with lots of publicly available data over time: stocks.

I'm posting an early screenshot. It shows the closing value of the Dow Jones, the NASDAQ, and several individual stocks over the past six months. We are looking for suggestions to improve the data display. We have already applied many Tufte principles, but we suspect there is still room to improve.

The gray text to the left of each sparkline is the stock symbol (or index symbol in the first two). The first, last, highest and lowest values are labeled directly.

A few notes about some of the interactive features not possible to experience in the screenshot:

Touching any sparkline displays the date and closing price on the date touched. If you want to see a different time period you can "swipe" through time (similar to photo app). For instance, swiping a finger from left to right on this view would show you the previous six months from April 20, 2008 to October 19, 2008. You can display data for one week (1w), one month (1m), three months (3m), one year (1y) or two years (2y) on a single screen by touching those buttons at the bottom. Lines can be displayed in any color -- not just the obnoxious colors shown here. A copy of the top sparkline (^dji in this example) can be dragged down the screen on top of other sparklines to make more direct comparisons. We are experimenting with simple animation to allow the user to watch the sparklines being "drawn" from the first date to the last date rather than just having them appear.

Thoughts? Improvements? Any iphone/itouch users out there who want to beta test? The beta is not yet available but will be shortly. Email me at the address below if you are interested.

-Aurora amatzkin@allofzero.com

• Picture posted to ask ET.pdf

-- Aurora Matzkin (email), April 20, 2009

Rapid Feedback : Stock Sparklines on the iPhone

I would love to see the DJIA (or some other index reference)
as a grey line behind the stock in question to allow layering.
Likewise, it would be good to be able to stack stocks on top of
each other for easy comparison by sector, beta, etc.
This is shown in Beautiful Evidence and referenced on the
Recovery Thread.

It would be great to use the pinch and stretch gestures to navigate
the time series. Might also consider using the magnifying glass to display actual
prices of every data point instead of showing the high and low all the time.
The new copy and paste gesture may also provide some interesting options.

You may want to remove the vertical bars in the time legend at the top
This would make all the lines on the interface horizontal. A blank pixel could be
used to separate the months on the horizontal axis. See Weather Icons above.

The obvious thing with this type of distributed application would be to
let people vote for the stock or even trade it. Could be interesting partnerships
available.

You may want to think about ways to swap between the ticker symbol and
the name of the company. Where (Country, etc.) it is listed could also be interesting for
international clients.

Why are the years 2008 and 2009 bigger than the other text? These are the two
data points that will be the least likely to change. Ideally you could get the
start date and end date on one line to conserve vertical space. Try using the format:
20 Oct 08 -------------- 16 Apr 09

A daily view would be interesting to see the sparkline build itself across the
screen throughout the day.

Movable guides (light horizontal lines or a grey box) might be interesting to be
able to define what the user considers the normal range. If the stock moves out of
this range then it could send an SMS to itself or bubble up an alert to do something.

Should we be concerned about the different y axes on each of the stocks? How does this
affect the interpretation of general trends?

See also Financial Data Displays thread

Good luck!

-- Tchad (email), April 20, 2009

Bruce Tognazzini, the founder of Apple's Human Interface Design group, has some suggestions for improving the design of iPhone's Springboard

-- Niels Olson (email), October 12, 2009

Droid resolution

Droid's 3.7 inch screen resolution is 854 by 480, for a pixel density of 267 ppi, which is super.

See the Gizmodo review for details.

Maybe Andrei and I will make another video, this one on Droid resolution.

-- Edward Tufte, November 4, 2009

stock market page

I was surprised you did not go into some of the more interesting (and hidden) features in the iPhone Stocks app.

First, the relatively obvious features. On the main screen, the stock-symbol list is scrollable. Tapping one of the red or green pills will change the data displayed: market cap, stock price increase, percentage increase. The panel below the list is swipe-able, revealing a scrollable news list, company stats, and the stock chart.

Second, the more interesting, non-obvious features. Rotating the phone to landscape reveals a full-screen chart. You can swipe the top to change companies, or choose a different time scale. You can also run your finger along the line and receive detailed stock-price information on varying scales (hours, minutes, days). Running two fingers along the line will display the price and percentage difference between two points on the chart..

This last feature—direct interaction with data—provides a specificity and precision which a sparkline can only gesture to. Of course, the design constraints of a touch interface (namely, the size of our fingers) dictate the size and information density of the directly-manipulatable elements on the screen. This would suggest a middle ground that can be partly defined as a relationship between passive and active consumption of data: sparklines for high-level overviews and context, with an ability to "zoom in" for in-depth exploration of data. In effect, a zoomable, interactive sparkline.

-- Dave Chiu (email), March 2, 2010

reply: stock market page

Didn't go into the features you mention because they didn't exist when Andrei and I made the iPhone video 25 months ago.

It would pleasing if the video prompted these new features, which happily showed up in the 3G release.

-- ET, March 2, 2010