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






About these ads

Tags: , ,

About npcdoom

Idealistic/Pragmatic!! Join the club

8 responses to “GSOC – Template Dialog UI”

  1. ericb says :

    Looks very similar to :

    Looks like a copycat somewhere …

  2. Fitoschido says :

    Hey, great work! Looks great, keep it up!

  3. dairdev says :

    Muy buen trabajo Rafael, vamos hazle honor al nombre y sorprendenos

  4. xsoh says :

    I believe Icons should change. It looks so old…

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s


Get every new post delivered to your Inbox.

%d bloggers like this: