Archive | June 2012

GSOC – Template Dialog UI

Hello all, my name is Rafael, im from Venezuela, this year i got selected by the libreoffice folks to work in the redesign of the UI for the Template Picking dialog as a part of the GSOC program sponsored by google. My mentor for this project is Cédric Bosdonnat.

The task consist of implementing a new interface for managing templates in libreoffice, the design was done by libreoffice designers team, you can check it here. The scope of the project can be summarized as follow:

  • Simplify the dialog
  • Make use of the preview images within the zipped document
  • Easily add and remove templates
  • Search
  • Show online templates as well as local ones

So how were suppose to use the dialog??? Its very simple, just keep reading


  • To open a template, simply click on its thumbnail.


  • 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.
  • Alternatively, the user may push the “Selection mode” button on the right of the tab bar. Under selection mode, the user can simply click a template’s thumbnail or title to select it. To exit selection mode, the user can click the “Selection mode” button again.


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


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


  • Folders would appear as a floating 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, select the template and push the delete toolbar button.
  • 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.

Here are some screenshots of the current progress