Pancake/French Toast: Difference between revisions

Latest revision as of 12:03, 2 January 2019

⚡ Warning: The content of this page is obsolete and kept for archiving purposes of past processes.

What is French Toast?

Meet French Toast: File:French Toast Intro.mov.tar.gz

French Toast is our code name for Pancake's next-generation user interface.

Design

French-toast-type-ahead-concept.c.01.png

French-toast-type-ahead-concept-2.c.01.png

More »

Minimum Viable Product

We're going to get here by way of a minimum viable product, which uses the existing Pancake infrastructure to create a search-based browser in the cloud.

Check out Pancake/French_Toast/UX/Minimum_Viable_Product for the details.

Prototypes

See Pancake/Prototyping for rational. User testing sessions:

Pancake/Prototyping/2012-08 General User Testing

Feature Notes

Notes from feature implementation discussions we've had. These are living, and therefore loose, specs. What we've outlined here are hypothesis on the best way to address user stories. They will probably evolve in response to prototyping.

Layer Navigation: "I want to understand where in the app I am, and how to navigate within it".
Search View: "Help me find x. I want the results to be easy to understand".
Type-ahead Search
Clips & Boards "I want to save something I've found", "I want to share things I like"

See Pancake/French_Toast/UX for design rational and a list of all UX sub-pages.

Design Files

File:French Toast Intro.mov.tar.gz: An intro to French Toast, including an animated demo.
File:French Toast UX Walkthrough.tar.gz: The master design document for French Toast. Contains wireframes, an animated prototype, design rational and user stories.
File:French-toast-pinning-and-updates.mov.tar.gz: Further explorations of pins and the updates feed.
File:French-toast-wireframe-artboard.pdf: a wireframe artboard exploring French Toast's UX concepts.
File:French-toast-ux-animated-wireframe.tar.gz: An early animated keynote wireframe exploring interaction concepts for French Toast.
File:French-toast-layer-behavior.mov.tar.gz: an in-depth description of how the layer navigation works.

Development

Code/Repositories

mozillapancake on Github: Group page for Pancake repos.
gordonbrander/french-toast-html on Github: Prototype markup and styles for French Toast. Only just started.
gordonbrander/French-Toast-Assets: Illustrator, Keynote and Photoshop files on Github.
sfoster/amd-store on Github: A store forked from Dojo that allows you to create live query sets. Mixins for XHR, LocalStorage, etc.
[1] early Pancake client.

@@ Line 1: / Line 1: @@
+{{RELEASE_MANAGEMENT_OBSOLETE}}
 == What is French Toast? ==
 Meet French Toast: [[File:French_Toast_Intro.mov.tar.gz]]
-French Toast is our code name for Pancake's [[Pancake/UX | next-generation user interface]].
+French Toast is our code name for Pancake's next-generation user interface.
 == Design ==
-* [[Pancake/French_Toast/UX]]
+{|
-* [[Pancake/French_Toast/Prototyping]]
+|-
+| [[File:French-toast-feed-concept.c.01.png | thumbnail | none | baseline]] || [[File:French-toast-type-ahead-concept.c.01.png | thumbnail | none | baseline]] || [[File:French-toast-type-ahead-concept-2.c.01.png | thumbnail | none | baseline ]] || [[Pancake/French_Toast/UX | More &raquo;]]
+|}
+==== Minimum Viable Product ====
+We're going to get here by way of a [[Pancake/French_Toast/UX/Minimum_Viable_Product | minimum viable product]], which uses the existing Pancake infrastructure to create a search-based browser in the cloud.
+Check out [[Pancake/French_Toast/UX/Minimum_Viable_Product]] for the details.
 ==== Prototypes ====
@@ Line 23: / Line 33: @@
 * [[Pancake/UX/Search | Search View]]: "Help me find ''x''. I want the results to be easy to understand".
 * [[Pancake/UX/Type-ahead Search | Type-ahead Search]]
+* [[Pancake/UX/Clips and Boards | Clips & Boards]] "I want to save something I've found", "I want to share things I like"
+See [[Pancake/French_Toast/UX]] for design rational and a list of all UX sub-pages.
 ==== Design Files ====
@@ Line 31: / Line 44: @@
 * [[File:French-toast-wireframe-artboard.pdf]]: a wireframe artboard exploring French Toast's UX concepts.
 * [[File:French-toast-ux-animated-wireframe.tar.gz]]: An early animated keynote wireframe exploring interaction concepts for French Toast.
+* [[File:French-toast-layer-behavior.mov.tar.gz]]: an in-depth description of how the layer navigation works.
 == Development ==
@@ Line 38: / Line 52: @@
 * [[Pancake/French_Toast/Store | Client-Side Store]]
 * [[Pancake/French_Toast/IO | Client-Side AJAX/IO]]
+=== Code/Repositories ===
+* [https://github.com/mozillapancake mozillapancake on Github]: Group page for Pancake repos.
+* [https://github.com/gordonbrander/french-toast-html gordonbrander/french-toast-html on Github]: Prototype markup and styles for French Toast. Only just started.
+* [https://github.com/gordonbrander/French-Toast-Assets gordonbrander/French-Toast-Assets]: Illustrator, Keynote and Photoshop files on Github.
+* [https://github.com/sfoster/amd-store sfoster/amd-store on Github]: A store forked from Dojo that allows you to create live query sets. Mixins for XHR, LocalStorage, etc.
+* [https://bitbucket.org/mozillapancake/pancake/src] early Pancake client.
 == Subpages of {{FULLPAGENAME}}==
 {{Special:PrefixIndex/{{FULLPAGENAME}}/}}