Thunderbird/Netbooks/Designs/Add-ons/Thunderbird Air

From MozillaWiki
Jump to: navigation, search

Layout & Size

Because our target audience is using a display with much more width than available height we've optimized for conserving height while using more width as it makes sense.

1024 x 570
1024 Max-Width
570 Min-Height

Tabs

The tabs in Thunderbird Air are saved with the session. Whatever tabs you had open when you were last using the interface are the tabs that will be reopened when you come back.

Almost every tab maintain a one to one relationship between the first class objects in the system or the listing of those objects.

Tab Location

Tabs are located on the side instead of the top where they normally are. This is because our clients have more horizontal room than we do vertical room.

Example:

  • HOME TAB
  • FOLDER TAB
  • CONVERSATION TAB
  • CONVERSATION TAB
  • CONVERSATION TAB
  • FOLDER TAB

TAB CONTENT AREA

Tab Types

We have 3 main types:

Home 
A dashboard view of your messaging and relationships. It's meant to be a starting point from which you would launch other activities.
Search Results 
Folders are a specific type search results that lists conversations. There are certain actions and ways to display conversations which are specific to folders however there are many shared aspects of listing conversations as well.
Conversations 
Lists of messages whose display is influenced by the search results it was opened from.

Tab Hierarchy

Conversation tabs open below the search result tab that opened them. This allows for a small amount of hierarchy relating conversations to the folders or lists they came from.

  • SEARCH RESULT TAB
  • CONVERSATION TAB
  • CONVERSATION TAB

Tab Collapsing

To save vertical space in the tab area as well as help to automatically organize tabs we have planned a tab collapsing system where child conversation tabs are collapsed into the parent search results tab.


Expanded An expanded search results tab with 2 conversations which were opened up from it.

  • SEARCH RESULT TAB
  • CONVERSATION TAB
  • CONVERSATION TAB

Collapsed The same search results tab as above with the 2 conversations now collapsed into the parent tab.

  • SEARCH RESULT TAB
    2 conversations

The collapsed tab should take up no more than the height of 2 tabs such that it is always at least the same or an improvement on space saving.

Tab Content

We are trying to keep a consistent arrangement of the content within tabs. We do this for simplicity as well as enabling a consistent future search experience.

[_search______] (v)
TAB CONTENT TITLE
CONTENT AREA

Home

The home page is intended to be a starting point (dashboard) for opening folders, searches, contacts and other views.

[_search______] (v)
Home
Home Page Area

Search Results

The search results tab is a generic container for a tab which knows how to list conversations. The search results aren't entirely generic because there are several ways in which the context of the search alter the display of the information.

Here are the basic elements of the search results, though certain sub searches can specialize these pieces.

  • General Query
  • Specific Query
  • Sort
  • Highlight


Folder

Folder search results are a specialized search result listing conversations in a folder.

  • General Query
    • Unread Conversations
  • Specific Query
    • None
  • Sort
    • Newest to Oldest
  • Highlight
    • None

Tab Content Layout

The tab content is arranged using the common tab content layout.

[_search______] (v)
Folder Name
List of Conversations in a Folder

Conversation List Layout

Each conversation displays the topic message with the oldest two unread messages as well as the count of other unread messages in the conversation.

Conversation

The Conversation tab is a generic container for displaying the messages in a conversation. There are specific ways to alter the display of the conversation which are informed by the opening search results tab.

Unread

Unread conversations is the most common conversation view which is opened from a search results without a specific query.

Tab Content Layout

The tab content is arranged using the common tab content layout.

[_search______] (v)
Conversation Subject
List of Messages in a Conversation