Update:Remora UI Review/Mockups/Home Page/2007-09-12 revisions/: Difference between revisions

 
(9 intermediate revisions by one other user not shown)
Line 25: Line 25:


== Category Page ==
== Category Page ==
The category listing which is permanently present in the upper left-hand corner of the front page is accessible on interior pages as an overlay that drops down from the "Current Category" box.


http://people.mozilla.com/~madhava/files/amo/2007-09-12/categorypage.png  
http://people.mozilla.com/~madhava/files/amo/2007-09-12/categorypage.png  


http://people.mozilla.com/~madhava/files/amo/2007-09-12/categorypage_menu.png  
Category page with category list displayed:
 
http://people.mozilla.com/~madhava/files/amo/2007-09-12/categorypage_menu.png


The current category is visibly unselectable.


== Full listings page ==
== Full listings page ==
http://people.mozilla.com/~madhava/files/amo/2007-10-05/fulllisting_page_071005.png
This page follows the same basic layout as the Search Results Page (further down this page) with a few important distinctions.  The differences are as follows:
* the grey bar before any results that lets the user choose how to order the add-ons (by name (a-z), by date (newest first), by popularity, and by rating.  These options do not make sense on the search page because there is an explicit order already -- how well they match the search criteria.
* the addons are not numbered
* the category drop down lists the current catetory (upper left corner).  There is no category associated with search results because they can span all categories
* the search field here still says "Find your add-ons" (or whatever the final wording is there).  The add-ons listed are not search results -- there is no serach currently in progress.
* the text in the footer lists says "# [category name] addons" rather than "# matching addons"
=== Tiles or rows? ===
At one point there was some discussion about whether we should go with a tiled or search-results-style layout for the full listings:


http://wiki.mozilla.org/images/5/51/Overflowvariants.png
http://wiki.mozilla.org/images/5/51/Overflowvariants.png
For AMO 3.2, we're going with the search-results-style layout.


== Details Page ==
== Details Page ==


http://people.mozilla.com/~madhava/files/amo/2007-09-12/detailspage.png  
http://people.mozilla.com/~madhava/files/amo/2007-10-05/addondetails_page_071005.png  
 
Notes:
* Advance details (ie. things of interest to developers) should be in an expandable area below the reviews. The area will will be closed by default if the user is not logged in, and, conversely, will be open by default if the user _is_ logged in.
 




=== Rating UI ===
=== Rating UI ===


http://people.mozilla.com/~madhava/files/amo/2007-09-12/rating_flow.png  
http://people.mozilla.com/~madhava/files/amo/2007-09-12/rating_flow.png


== Search Results Page ==
== Search Results Page ==


http://people.mozilla.com/~madhava/files/amo/2007-09-12/search_results.png  
http://people.mozilla.com/~madhava/files/amo/2007-10-05/searchresults_page_071005.png
 
=== When we want to intervene ===
 
Occasionally, when the site notices that a keyword that it's watching for is one of the search terms, it may intervene and put a message before the first search result.  This can be used when, for example, one of the search terms is "tab" -- we can point out that there is a whole category of tab-related toolbars.  Or if the search contains the name of a language for which there is a language pack, we can offer to take them directly to the language pack.  This would look like the following:


http://people.mozilla.com/~madhava/files/amo/2007-10-05/searchresults_intervention_071005.png


== Recurring Features ==
== Recurring Features ==
Line 56: Line 87:


Some examples of what these could look like:
Some examples of what these could look like:
** Apple now has the kind of viewer with thumbnails I was thinking of on a number of their pages.  See here for example: [http://www.apple.com/iwork/pages/#compatible Example page (click on preview at right)]
* Apple now has the kind of viewer with thumbnails I was thinking of on a number of their pages.  See here for example: [http://www.apple.com/iwork/pages/#compatible Example page (click on preview at right)]
** Click on a thumbnail image for a great transition effect: [http://www.panic.com/coda/ http://www.panic.com/coda/]
 
** Slimbox, a Lightbox clone: [http://www.digitalia.be/software/slimbox Slimbox]  Look at the multi-image version
* Click on a thumbnail image for a great transition effect: [http://www.panic.com/coda/ http://www.panic.com/coda/]
 
* Slimbox, a Lightbox clone: [http://www.digitalia.be/software/slimbox Slimbox]  Look at the multi-image version


=== "Smart" Download Buttons ===
=== "Smart" Download Buttons ===
Line 67: Line 100:


http://people.mozilla.com/~madhava/files/amo/2007-09-12/smartbuttons_nobundling.png
http://people.mozilla.com/~madhava/files/amo/2007-09-12/smartbuttons_nobundling.png
Would we really be able to do this? It would require exposing the list of installed extensions to content, which is probably not a good idea. — [[User:Db48x|db48x]] 09:13, 3 November 2007 (PDT)


== Longer-term ideas ==
== Longer-term ideas ==
38

edits