It's Made of People!

I frequently remember documents by the people that have also touched them in some way.

Contact details and related files

Viewing contact details and related files

The files shown below the contact details are those sent to or received from, or authored by the contact. The contact details section increases in height to the point of only showing two rows of files if necessary.

Contacts list popover

Contacts list popover

The iPad guidelines say popovers cannot be styled so consider this aspirational.

Contacts sidebar and details split view (landscape)

Contacts list and details in landscape

Editing Contact Details

Editing contact details

The details card slides down out of the corners and expands.

Viewing Files

Document viewer

The Info button at top right displays a popover listing file metadata.

Icon Sources

Some from app-bits, some from glyphish. My thanks to both.

iPhone Power Settings

Mike Davidson posted a critique of the number of steps required to change battery life-extending settings on the iPhone. Off the top of my head, I proposed what I mocked up and posted below; an always available means of switching among configurations.

  1. Tap the battery icon at the top right of the screen. This target is potentially problematic given the relatively small size and its proximity to other controls.

    Tap battery icon

  2. Tap the name of a configuration to activate it or the disclosure button to the right of the label to view/edit its details. The Add button opens an Untitled configuration with the default iPhone settings.

    Power settings list

  3. Edit the settings by sliding one or more sliders or tap the oval to edit the configuration name.

    Settings sliders

  4. Edit the name and tap Done. The sliders remain manipulable.

    Editing configuration name

  5. The configuration has been renamed. Tap the OK button to return to the configurations list.

    Renamed power configuration

November 12 Update: Minor changes to better follow iPhone conventions, larger thumbnails with alpha channels.

Data Store Store

During my holiday visit to Seattle, I helped two people address disk space shortages on their Macs. While purchasing additional storage was not the solution I recommended in either case, it got me thinking about the issue.

There are many places to buy storage online, and a few of them allow you to filter the options based on the Mac the drive will be in or attached to. This is helpful, but it would be better to filter the list automatically based on the known system configuration without requiring user input.

  1. The Warning Dialog

    I didn’t have a screenshot of the actual current dialog, so I had to work off an old screenshot I found. Regardless, the only important difference is the addition of the Additional Storage button.

    Low disk space warning

    1. Compatible Storage List with Item Details

      The list is generated based on your hardware. For example, if you have added an eSATA controller, eSATA drives would also be shown.

      Showing the formatted capacity makes it easier to determine exactly how much additional storage you will get. The filesystem type in parentheses could be a pop-up menu to select different formats.

      Additional item details could include cache size, noise levels, power consumption and conservation features, seek times, etc.

      Storage device list with item details

    2. Compatible Storage List with Item Reviews

      The value of reviews really depends on the number provided, but even one can contain useful information not provided elsewhere.

      Storage device list with item reviews

  2. Reviewing Your Storage Order

    Reviewing storage device order

  3. Placing Your Storage Order

    All credit card type logos would be fully opaque until the first digit is input. Once input, the matching logo remains opaque while the others become semi-transparent.

    Checking “Ship to a different address…” would vertically expand the window to accommodate another set of fields for shipping information. Billing and shipping fields would be auto-completed based on your address book.

    Placing storage device order

The Mac Pro, FireWire, Internal, USB, and generic External icons are property of Apple. The Cuica hard drive icon is Metal OS from Carlos Reyes' Carlito Drives set.

An Alternate Approach

System information could be sent to a web-based store as part of a generated URL (similar to Google Charts) after clicking Additional Storage on the warning dialog.

Reading at 160ppi

Prior to the unveiling of Books.app, a book reader for the iPhone, I’d begun working on my own design. I figured the iPhone would be fairly comfortable for extended reading due to the bright display and high pixel density (which allows it to render text closer to print quality). Thanks to Chris Messina for the Keynote template with basic iPhone images he posted.

Book List

The screen you initially see after pressing the Books app icon on the Home screen:

iPhone books sorted by author

Pressing Title switches the sorting method:

iPhone books sorted by title

Searching

Pressing Search on the bottom button row triggers a sliding transition; the navigation buttons are replaced by a search field and Search button. The keyboard appears below.

iPhone book search

iPhone book search results

Pressing Books returns to the list with the last active sort in effect.

Table of Contents

Nothing too special…

Dune table of contents

Book Info

Additional book details such as the original publisher and publication date. I haven’t settled on exactly what metadata should be displayed here.

Book information

Pressing the cover overlays a large version. The two-fingered spread/pinch gesture could zoom in and out.

Enlarged book cover

Index

Assuming an index is embedded in the book file (or automagically generated), this would be an alternative to Search.

Alphabetical book index

Pressing on a index entry displays excerpts of sentences containing the phrase in order of appearance. Pressing one of these navigates to the page.

Index of Baron Von Harkonnen

The Book

The page structure of the physical book should be retained, but a continuous scrolling interface sounds better to me than using paging. Pages are an implementation detail (unless you are reading scrolls). The pinch/spread gesture could be used here to decrease and increase the text size, automatically reflowing the text (minding widows and orphans!). Pressing on illustrations would either overlay them similar to the cover in the Info view or open them on their own screen. If the illustration has a title and caption, a separate screen with a Go Back-type button would probably be preferable.

Book text content

The zipped Keynote ’08 file has links set up to give some idea as to the flow. Keynote’s animation tools have improved, but they are not yet to the point where I can comfortably create the transition animations that I have in mind for a book reader.

Yes, there would be a Cover Flow view when in landscape orientation. You can mock that up with your imagination. No, I do not have an iPhone. I hate phones, but I do like books.

How about an SDK, Apple?

Media Center Revised

My brother rightly stated that my media center design needed more eye candy.

Media Center Revision 1 (4.5MB PDF)

I’m proud of my director’s chair, but feel free to make fun of any of the other icons.

June 9, 2005 Update: I’ve improved the PDF with page bookmarks and links that approximate use of the interface with a remote control. For example, from the Main Menu (page 3), click Television -> Shows -> Alias to drill down through the interface.