• If you are citizen of an European Union member nation, you may not use this service unless you are at least 16 years old.

  • Buried in cloud files? We can help with Spring cleaning!

    Whether you use Dropbox, Drive, G-Suite, OneDrive, Gmail, Slack, Notion, or all of the above, Dokkio will organize your files for you. Try Dokkio (from the makers of PBworks) for free today.

  • Dokkio (from the makers of PBworks) was #2 on Product Hunt! Check out what people are saying by clicking here.

View
 

ThemeRoller gallery

This version was saved 13 years, 7 months ago View current version     Page history
Saved by Todd Parker
on December 9, 2008 at 4:11:15 pm
 

The ThemeRoller gallery tab needs a a re-vamp to make it more interactive with voting an duser-generated themes. All existing themes need to be updated to work with the additional theme levers added and we want to add a new new presets too.

 

New gallery design

The current gallery consists of a hard-coded flat file with a set of TR URLs which are loaded into a series of small iframes. The nice thing is the themes are interactive but the tab takes a long time to load. In the next release, we woudl really like to create a more dynamic, community-powered theme gallery. Each saved theme would have the following attributes:

 

  • Server-generated thumbnail for each theme
  • Title (ex. "South Street")
  • Name of creator: optional, default to "Unknown" if left blank (Ex. "John Doe")
  • Web URL of creator, use as link for creator name: optional do not link name if left blank (Ex. www.foo.com)
  • Average star rating of theme (1-5 stars) and total count of votes
  • Date added (Ex. "November 22, 2008")
  • ThemeRoller URL

 

Theme could then be sorted by:

  • Most viewed (most clicks to view > least)
  • Newest (latest date first > oldest)
  • Top rated (highest rating > lowest)

 

The mockup on the right is a very early sketch (yes, the tabs are wrong) that illustrates how this could look in the new ThemeRoller 2.0 layout. Each theme could simply have the thumbnal, title, creator and star rating to keep the presentation simple and compact.

Clicking on a theme would refresh the widget preview on the right but keep the user on the gallery tab. Once a theme is clicked, we can use an animation to display the theme actions panel (see lower right gray box with "jQuery UI Default" title). In the theme actions panel, we display:

 

  • Title
  • "by {creator}" - creator name is linked ot their web URL (if provided)
  • Rate this theme label with 5 star rating widget that saves on click via AJAX
  • Download button - creates downloadable zip of theme css and widget sample pages
  • Customize button - flips use over to the "Roll your own" tab pre-filled with selected theme values

 

In order to make this happen, we would need a developer who has the time to build out this functionality. Filament Group can provide all the front end design and coding, but we need a developer to built out the back end and database.

 

I'd like to see if this is feasible for the 1.6rc3 release so please chime in. If not, we can launch with a similair design that does not have the sorting stars that is a static list of URLs and thumbnails.

 

 

New Themeroller themes need to be designed

We've heard that the default theme is too gray and not punchy enough in ThemeRoller. We need to find a default theme that is slick but not too wacky that it won't fit in with a user's application so we need to walk a fine line. Anyway, here are two more themes to consider, both use our  our top-secret rounded corner parameter (FF&Safari only).

 

Here is a light theme with an orange on state:

[ UI Orange glass ]

 

Or a more corporate blue theme that feels a bit like Vista:

[ Corporate blue

 

And a cool dark with green theme with the wave texture:

[ Dark wave ]

 

Dark wave with blue:

[Cool wave]

 

Orange on state with warm gray/beige off, similar to orange glass but warmer

[ Warm orange ]

 

Feel free to keep adding new ideas!

Comments (0)

You don't have permission to comment on this page.