Design/Templates and documents rework

    From The Document Foundation Wiki

    Summary

    Redesign the "Templates and documents" dialog.

    Status

    Call for Proposals Analyzing Proposals Shaping Tentative Design Implementation in Progress Implemented

    Scope

    In Scope Out of Scope
    • Simplify the dialog
    • Make use of the preview images within the zipped document
    • Easily add and remove templates
    • Search
    • One-level folder hierarchy
    • Show online templates as well as local ones
    • Design by iterations
    • Repository management
    • Template sharing

    Discussion

    Design Bugs

    Design Bugs

    Tentative Design

    Mockups

    Description

    Opening

    To open a template, simply click or tap on its thumbnail.

    Selecting

    To select a template using a mouse, click within the checkbox that appears on hover. Clicking the checkbox of another template causes it to be added to the selection. To unselect a template, click its checkbox again. To select a template using a finger, long-tap on a template.

    Alternatively, the user may push the "Selection mode" button on the right of the tab bar. Under selection mode, the user can simply click/tap a template's thumbnail or title to select it. To exit selection mode, the user can click/tap the "Selection mode" button again.

    Creating

    To create a template, the user would push the "Create a template" button in the toolbar, which would trigger a menu with filetype options.

    Importing

    To import a template, the user would push the "Import a template" button in the toolbar, which would launch a file browser dialog.

    Folders

    Folders would appear as a floating overlay, as pictured above. The overlay would be scrolled with the entire window (i.e. the scrollbar would appear on the right edge of the window, not of the overlay).

    To move a template to a folder, either select the folder and push "Move to folder" or drag the template's thumbnail onto the folder thumbnail or onto the "Move to folder" menu.

    To remove a template from a folder, either select the template and, under the "Move to folder" menu, choose "No folder", or drag the template's thumbnail out of the folder overlay.

    To create a folder, either select a template and, under the "Move to folder" menu, choose "New folder", or drag a template's thumbnail onto another template's thumbnail.

    To rename a folder, simply click its name on the folder overlay.

    Action Overflow

    The action overflow (triggered by the icon with three squares) would house a "Sort by" menu and an "Options" button. The "Sort by" menu would allow the user to sort by name or date.

    Options

    The Options dialog would allow the user to add template repositories.

    Proposals

    Proposal by Alexander Wilms

    Mockups

    The option to create new documents or open existing ones would be removed, since this is simply a duplication of already existing features. The main use case would be that the template center is opened from the start center.

    The scrollable area would contain previews, metadata like the author's name etc. would be displayed in a row at the bottom. Each of the tabs shows templates for one application (Writer, Calc, Impress) or color/font/... schemes (Styles). The thumbnails would be retrieved from the 'Thumbnails' folder within the zipped odf-document, the metadata would be retrieved from the meta.xml file. Templates can be removed or added, if one uses a certain (slideshow) template it should automatically be adjusted to fit the screen ratio (cf. tdf#46190)

    The option to manage the address book should be moved to the "Extras" menu, if there is no other way to access it.

    Description

    Overview

    Clicking/tapping once on a template opens it in LibreOffice. Existing templates/documents can be opened via the folder icon in the toolbar. Pressing the cloud button pulls templates from the online repository. The selection mode is used to remove templates, move them from one folder to another or create new folders. Dragging one template onto another one creates a new folder; the user can enter a name. Folders show smaller previews of some documents which it contains. If one selects a folder, its content is being displayed inn the main window. If one views the content of a folder and enables the selection mode, one can drag templates to the first entry in the grid (the one with the arrow) to move them to the root folder.

    Categories

    As a default, there are no folders/categories

    Search

    The search would use the filname and the information provided in the document properties, eg. the name or tags.

    Proposal by Mirek2

    Mockups

    Description

    Opening

    To open a template, simply click or tap on its thumbnail.

    Selecting

    To select a template, click or tap below the thumbnail, on the portion with the title. (This behavior is similar to that in Google Drive.) Clicking on the title of another template causes it to be added to the selection. To unselect a template, click below its thumbnail again.

    Folders

    To move a template to a folder, either select the folder and click "Move to folder" or drag the template's thumbnail onto the folder thumbnail.

    To remove a template from a folder, either select the template and, under the "Move to folder" menu, choose "No folder", or drag the template's thumbnail out of the folder overlay.

    To create a folder, either select a template and, under the "Move to folder" menu, choose "New folder", or drag a template's thumbnail onto another template's thumbnail.

    To rename a folder, simply click its name on the folder overlay.

    Proposal by Android272

    Mockups

    Description

    Preview

    The Preview on the left has a next/previous page buttons so you can look through each page before you create the document.

    Open Problems

    Closing the folder overlay

    The following options are not exclusive, and we may choose both.

    Using a close button By clicking outside the overlay
    • Most obvious and intuitive option
    • Standard behavior on Android

    Final decision: Both.

    Moving files from the folder overlay

    The following options are not exclusive, and we may choose both.

    Templatesanddocuments 6.png

    By dragging outside the overlay

    T-drag.png

    By dragging to the toolbar

    • Doesn't require a contextual toolbar
    • Maximizes the surface area of the overlay
    • Offers more destinations

    Final decision: Both.

    Navigation between pages inside the thumbnail

    None T-nav.png

    On hover over a template

    By sliding the template horizontally
    • Simple to implement
    • Most accessible to mouse users
    • Common behavior on touch interfaces

    Final decision: None.

    Tentative Design

    • Use single click to create an instance of a template.
    • Use a checkbox that appears on hover or the title of the template to select it
    • Use an overlay to represent a folder.

    Relevant Art

    Open Points

    • Are there templates for applications other than Writer, Calc and Impress?
    Why not Draw? But those are the most important ones.
    • Would this be useful? => If a template is selected we could possible show a bigger previews with more details in a pane on the right. Should the details be displayed there aswell? Cf. image33.png
    Let's start simple and leave that aside until we have the rest up and running.
    • Should the template names be displayed below each preview or at the bottom?
    Below each template, users are used to it. OS's organize that way
    • Is it possible to include templates from templates.libreoffice.org
    CMIS integration is possible: http://www.netsight.co.uk/blog/plone-cmis-integration
    Can we retrieve ratings?
    Star ratings vs. Up/Down-votes?
    We can retrieve anything we want from a CMIS-enabled server. We would just need to have that this as a metadata on the file.
    • is it possible to import styles/color schemes or something similar?
    That would be another feature, or a special kind of template may be. Applying themes isn't implemented ATM... but definitely to be done later.
    • We need to add a section to the options in order to let the user specify a CMIS repository
    Sure. It would fit in the Paths page.
    • There is a design problem with the template creation: from that dialog point of view, creating a new template is simply creating a blank document. The tricky UI part for this is when saving that document (which isn't really addressed here).
    If we keep that Create Template menu item, I would be in favor of integrating the new files creation to this dialog in some way and replace the File > New menu by this one.
    How can we have a simple UI for saving templates (I mean, easier than what we have now), either by changin and using this dialog (and not take above point into account) or by adding a new / changing UI for it.