reading life - collections - magazines_v2
TRANSCRIPT
_experience the commitmentTM
Reading Life - Collections - MagazinesTablet Wireframes
Version: 1.0Published: August 01, 2013 Created By: Shanak Rahman ([email protected])
Disclaimer: Document is not indicative of final graphic design, colour and exact scale. For identification of elements & their relationships only.
Confidential and Secure Handling Required
Page 2 of 15Reading Life - Collections - MagazinesVersion: 1.0 | Published: August 01, 2013 | Created By: Shanak Rahman ([email protected])
15
14
13
12
11
10
9
8
7
6
5
4
3
Table of ContentsChange Log
Magazines Collection
Magazines Collection - Interactions
Magazines Collection - Drag&Drop
Magazine Collection - Selected State Options
Magazines Collection - Subscription
Magazines Collection - Subscription - Interactions
Magazine Collection - Selective Sync - Downloading book from Cloud
Magazine Collection - Secondary Options - Sync, Download All, Kobo Settings
Magazine Collection - Selective Sync - Remove Issue
Magazine Collection - Selective Sync - Remove Cloud Issue
Pinned issue in custom collection
Magazine States & Selected State Options
Disclaimer: Document is not indicative of final graphic design, colour and exact scale. For identification of elements & their relationships only.
Confidential and Secure Handling Required
Page 3 of 15Reading Life - Collections - MagazinesVersion: 1.0 | Published: August 01, 2013 | Created By: Shanak Rahman ([email protected])
Change LogPAGE /SECTION
VERSION 1.0-1.1
First draft of Magazine Wires1.0
New sort optionsAll remove cases are documentedCollection secondary options are documented
1.1
Disclaimer: Document is not indicative of final graphic design, colour and exact scale. For identification of elements & their relationships only.
Confidential and Secure Handling Required
Page 4 of 15Reading Life - Collections - MagazinesVersion: 1.0 | Published: August 01, 2013 | Created By: Shanak Rahman ([email protected])
PAGE TITLE:
USER STORY:
HIERARCHY:
WIREFRAME
Magazines Collection
Hom
e
Wired
12 issues
PC M
ag12 issues
Slam24 issues
Noitification Bar
Apr 2013
Mar 2013
Jan 2013
1 Magazines Recent Reads areaThis area shows one magazine per subscription in the users library. If the user has 4 subscriptions, four of their most recently opened issue will be at the front. If there are no recently read issues, it will show the most recently available issue, and it can be in either a downloaded or cloud state.
The purpose of this area is to be a convenient launcher for recent items.
2 Collections as subscriptionsWhen the user subscribes to a magazine, it creates a collection which is comprised of its corresponding issues. The collections house all owned issues.
3 Collection cover imageMost recent touched item OR most recently downloaded issue (whichever is most recent). This means that the cover could be different than the one in the Recent Reads area.
1
3
24
4 New Issue IndicatorIf a new issue is available, that has not been opened yet, there will be a new issue indicator to communicate that, with a number count.
The indicator will remain till the issue(s) are actually opened by the user.
5
4 Tools areaSync and options are housed here.
Sync - On tap: launches syncing with the Kobo service. A notification will show in Android Notification Centre informing that the sync is happening.
Options - On Tap: Details outlined on page: Magazine Collection - Secondary Options
Magazines
2
Disclaimer: Document is not indicative of final graphic design, colour and exact scale. For identification of elements & their relationships only.
Confidential and Secure Handling Required
Page 5 of 15Reading Life - Collections - MagazinesVersion: 1.0 | Published: August 01, 2013 | Created By: Shanak Rahman ([email protected])
PAGE TITLE:
USER STORY:
HIERARCHY:
WIREFRAME
Magazines Collection - Interactions
Hom
e
Wired
12 issues
PC M
ag12 issues
Slam24 issues
Noitification Bar
Apr 2013
Mar 2013
Jan 2013
Magazines
1 Tapping on issueOpens reading experience.
2 Longpress on issueAllows user to drag & drop or activate the secondary menu options on that issue. Detailed in this document.
3 Longpress on empty space OR tap OptionsDetails outlined on page: Magazine Collection - Secondary Option
4 Tap on collectionOpen the the magazine collection.
5 Long press on a collectionUsers can long press and reorder magazine collections. Users cannot drag and drop shelves into other shelves. All magazine collections must live on this level.
1
2
3
4 5
3
Disclaimer: Document is not indicative of final graphic design, colour and exact scale. For identification of elements & their relationships only.
Confidential and Secure Handling Required
Page 6 of 15Reading Life - Collections - MagazinesVersion: 1.0 | Published: August 01, 2013 | Created By: Shanak Rahman ([email protected])
PAGE TITLE:
USER STORY:
HIERARCHY:
WIREFRAME
Magazines Collection - Drag&Drop
Hom
e
Wired
12 issues
PC M
ag12 issues
Slam24 issues
Noitification Bar
Apr 2013
Mar 2013
Jan 2013
Magazines
Apr 2013
1
1 Drag&Drop in issuesDragging and dropping magazines in the library essentially allows user to perform actions on a duplicate of said file.
Only exception: If user wishes to place the issue in a different location within the list (reorder), the "original" copy will move the new location. The "original" copy should essentially replace the target shadow in this interaction
4
Remove Issue 5
3
Add to Collection 6
4 ReorderUser is able to reorder items in the widget area the same way they reorder items in regular collections.
6 Add to CollectionLaunches Add to Collections dialog.
Note: When a user adds an issue to the custom collection Cooking, to the Kobo service it makes a custom shelf with that issue in it.
Thus if that user uses a Kobo Android app, they should see a Cooking shelf.
3 HomeUser can drag&hold a copy of the item and move it to another collection.
5 Remove issueLaunches remove issue experience. Detailed on page: "Magazine Collection - Selective Sync - Remove issue".
If the user proceeds to remove the issue from the device, the next most relevant issue will appear in its place inside the Recent Reads area.
2
2 On Drag optionsWhen dragging regular pinned items in collections, a remove option drops down - in the library we will have Add to Shelf and Pin to Tapestry instead as quick options.
Disclaimer: Document is not indicative of final graphic design, colour and exact scale. For identification of elements & their relationships only.
Confidential and Secure Handling Required
Page 7 of 15Reading Life - Collections - MagazinesVersion: 1.0 | Published: August 01, 2013 | Created By: Shanak Rahman ([email protected])
PAGE TITLE:
USER STORY:
HIERARCHY:
WIREFRAME
Magazine Collection - Selected State Options
House
92 Items
Noitification Bar
Library
1 Selected stateTo get a issue into selected state and hence activate the secondary menu:
• Long press on an item• Release and drop to the collection
2 Secondary Library OptionsDepending on the type of item selected, it will have a different set of secondary options.
Secondary options by item type are listed in this deck on page: Magazine States & Selected State Options
4 Tap behaviour for secondary options
See Subscription Details: launch overview in slide outRemove Issue: Experience shown on page: "Library - Selective Sync - Remove issue"Add to collection: Launch pin dialog
3 Multi SelectOnce one item is selected, the user can select multiple items, after which the secondary options will change accordingly.
This will allow users to create collections with multiple issues easily.
Remove Items Add to Collection4 Selected
5
5 Multi-Select menu
This shoes how the menu options change as you select multiple items.
Magazines
2
1
See Subscription Details Remove Issue Add to Collection1 Selected
43
Wired
12 issues
PC M
ag12 issues
Slam24 issues
Apr 2013
Mar 2013
Jan 2013
Disclaimer: Document is not indicative of final graphic design, colour and exact scale. For identification of elements & their relationships only.
Confidential and Secure Handling Required
Page 8 of 15Reading Life - Collections - MagazinesVersion: 1.0 | Published: August 01, 2013 | Created By: Shanak Rahman ([email protected])
PAGE TITLE:
USER STORY:
HIERARCHY:
WIREFRAME
Magazines Collection - Subscription
Magazines
Noitification Bar
May 2013
1
1 All issues listed hereAll user's issues for this subscription listed here.
3 SortOn Tap: Following dialog shows. Default to Date
April 2013
March 2013 Jan 2013
Feb 2013 Dec 2012
Nov 2012
Oct 2012
2 3 5
... Custom SortIf the user manually reorders their collection, all sort options are deselected.
If the user would like, they can then go into sort and resort the list into one of the three options, at which time their custom sort order will be lost.
There should be a smooth animation when books are moving to their new sort order.
2 SyncSync - On tap: launches syncing with the Kobo service. A notification will show in Android Notification Centre informing that the sync is happening.
5 OptionsOptions - On Tap: Details outlined on page: Magazine Collection - Secondary Option
PC Mag
Apr 2013
4 Last ReadSorted by most recently opened OR date added.
Sort By
Last Read
Date4
Disclaimer: Document is not indicative of final graphic design, colour and exact scale. For identification of elements & their relationships only.
Confidential and Secure Handling Required
Page 9 of 15Reading Life - Collections - MagazinesVersion: 1.0 | Published: August 01, 2013 | Created By: Shanak Rahman ([email protected])
PAGE TITLE:
USER STORY:
HIERARCHY:
WIREFRAME
Magazines Collection - Subscription - Interactions
Magazines
Noitification Bar
May 2013
April 2013
March 2013 Jan 2013
Feb 2013 Dec 2012
Nov 2012
Oct 2012
Apr 2013
PC Mag
1 Tap on Parent Tapestry Tapping either bar take you to the parent
2 Tapping on issue you ownOpens the reading experience
3 Longpress on issue you ownEither activates drag & drop or selected state options. Each experience is highlighted on subsequent pages.
Drag&Drop experience detailed on page: Magazine Collection - Drag&Drop
Selected state options experience detailed on page: Magazine Collection - Selected State Options.
5 SwipeSwiping will scroll the Libraryif applicable.
4 Longpress on empty space OR tapping on Options iconBoth launches the same dialog with following secondary actions: Import Content and Download All, Kobo Settings
Secondary options detailed on page: Magazine Collection - Secondary Options
4
2
31
5
4
Disclaimer: Document is not indicative of final graphic design, colour and exact scale. For identification of elements & their relationships only.
Confidential and Secure Handling Required
Page 10 of 15Reading Life - Collections - MagazinesVersion: 1.0 | Published: August 01, 2013 | Created By: Shanak Rahman ([email protected])
PAGE TITLE:
USER STORY:
HIERARCHY:
WIREFRAME
Magazine Collection - Selective Sync - Downloading book from Cloud
3 Progressive DownloadAfter the download reaches a certain threshold, the user can have access to read the magazine while the rest of it downloads in the background.
To communicate it to the user, the greyed out background is removed, and tapping anywhere will open the magazine.
1 User taps on cloud state issueIt changes to the downloading state. This includes a download progress bar.
2 User taps on downloading state issueThis pauses the download - puts it back in its download state
May 2013 May 2013 May 2013May 2013
1
2
May 2013
3
Disclaimer: Document is not indicative of final graphic design, colour and exact scale. For identification of elements & their relationships only.
Confidential and Secure Handling Required
Page 11 of 15Reading Life - Collections - MagazinesVersion: 1.0 | Published: August 01, 2013 | Created By: Shanak Rahman ([email protected])
PAGE TITLE:
USER STORY:
HIERARCHY:
WIREFRAME
Magazine Collection - Secondary Options - Sync, Download All, Kobo Settings
Choose an Action
Download All
Kobo Settings
How to add to this Collection
Kobo Help
1
1
2
4 Kobo HelpLaunches Intelliresponse in the browser.
1 Download AllTapping here puts all books in the cloud in a download state.
2 How to add to this CollectionOpens books empty state flyout, outlined in wires:Custom Collections - Empty States - Help Flouts
3 Kobo SettingsFull settings experience located here:Reading Life - Collections - Books.pdf
2
2
Disclaimer: Document is not indicative of final graphic design, colour and exact scale. For identification of elements & their relationships only.
Confidential and Secure Handling Required
Page 12 of 15Reading Life - Collections - MagazinesVersion: 1.0 | Published: August 01, 2013 | Created By: Shanak Rahman ([email protected])
PAGE TITLE:
USER STORY:
HIERARCHY:
WIREFRAME
Magazine Collection - Selective Sync - Remove Issue
See Subscription Details
Remove Issue
Add to Collections
See Subscription Details
Remove Issue
Add to Collections
3
11 Remove issue Experience
If a user taps Remove Item, we prompt the user with two options. Removing from device removes the item from the device, but keeps it in the user's library. We should delete any pinned instances of the issue from any collection as well.
Delete item from Library deletes the issue entirely from the users library (and the device of course)
2 Issue state changes to cloud stateThe issue is now in the cloud state. Tapping on the cloud state will start the download of the issue onto the device..
2
3 Issue removedIssue is removed from the Library. Any instance of it is also deleted.
Remove Item...
From LIbraryCancel From Device
Remove from Device lets you re-download items from the Kobo Cloud later.
Remove from Kobo Library clears your items from the Kobo Cloud and from all of your devices.
Remove Item...
From LIbraryCancel From Device
Remove from Device lets you re-download items from the Kobo Cloud later.
Remove from Kobo Library clears your items from the Kobo Cloud and from all of your devices.
Disclaimer: Document is not indicative of final graphic design, colour and exact scale. For identification of elements & their relationships only.
Confidential and Secure Handling Required
Page 13 of 15Reading Life - Collections - MagazinesVersion: 1.0 | Published: August 01, 2013 | Created By: Shanak Rahman ([email protected])
PAGE TITLE:
USER STORY:
HIERARCHY:
WIREFRAME
Magazine Collection - Selective Sync - Remove Cloud Issue
See Subscription Details
Remove Issue
Add to Collections
11 Remove Issue - Issue in Cloud
A Issue from the cloud can only be removed from the users Library.
2 Issue removedIssue is removed from the collection. Any instance of it is also deleted.
Remove from Library?
This clears your item from the Kobo Cloud and from all your devices.
RemoveCancel
2
Disclaimer: Document is not indicative of final graphic design, colour and exact scale. For identification of elements & their relationships only.
Confidential and Secure Handling Required
Page 14 of 15Reading Life - Collections - MagazinesVersion: 1.0 | Published: August 01, 2013 | Created By: Shanak Rahman ([email protected])
PAGE TITLE:
USER STORY:
HIERARCHY:
WIREFRAME
Pinned issue in custom collection
1 Custom CollectionThis document shows what happens to a issue after it is pinned to a custom collection
2 Pinned issueThe issue itself behaves as if its inside of the Magazines Collection. The progress bar is maintained and updated. Press and hold will activate the same secondary drag menu, and secondary menus. Resizing is enabled as well.
Noitification Bar
Tap here to create a
collection
Hom
e
1
2... Removing the issue
Remove options from here will NOT activate the remove experience from the Kobo service, rather it will simply remove the pinned copy in this collection.
IE. For a user to remove a issue from the device or the library, they must do it from the Magazines collection.
... Collections - Kobo Shelf relationshipIf a Kobo issue is housed in a collection or sub-collection, it creates a shelf in the Kobo Service with the same collection name, and vice versa.
A consequence of this rule is: Naming for ALL kobo collections must unique on a Global level, not a local level, as it is now. IE there may only be one collection named "Cooking" on the entire device (collection or sub-collection levels).
Renovations
Disclaimer: Document is not indicative of final graphic design, colour and exact scale. For identification of elements & their relationships only.
Confidential and Secure Handling Required
Page 15 of 15Reading Life - Collections - MagazinesVersion: 1.0 | Published: August 01, 2013 | Created By: Shanak Rahman ([email protected])
PAGE TITLE:
USER STORY:
HIERARCHY:
WIREFRAME
Magazine States & Selected State Options
Purchased issue - secondary options
See Magazine Details
Remove Issue
Add to collection
.. Tap behaviour for secondary options
See Subscription Details: launch subscription overview in slide outRemove Issue: Experience shown on page: "Magazine - Selective Sync - Remove issue"Add to collection: Launch pin dialog
May 2013
Purchased Magazine - In progress
May 2013
Purchased Magazine - Not Opened
May 2013
Purchased Magazine - Not Downloaded
Purchased Magazine - Finished
May 2013
Purchased issue - secondary options
See Magazine Details
Remove Issue
Add to collection
Purchased issue - secondary options
See Magazine Details
Remove Issue
Add to collection
Purchased issue - secondary options
See Magazine Details
Remove Issue
Add to collection