For designers who are going to provide a theme based design to OM4.

Selecting Themes

The themes OM4 is familiar with include: OM4 Themes

Special Effects

Theme designs should be based on actual theme capabilities. It is not always possible to ‘mix and match’ special effects from one theme area to another. For example, some themes have specialised slider capabilities that only work in sliders, or specialised hover effects that only work on specific types of buttons. If you cannot see an example of the effect you are considering in the demo or the theme element hasn’t broken out as a theme ‘element’, you may need to review the theme documentation to see if an effect is able to be configured using the theme.  Customisation of a theme to merge an effect from one area into another is typically a costly exercise for clients.

Delivery

You can deliver your design using Photoshop, or as a PDF. In both cases, please provide a document with explanatory notes (or annotations within the layouts) that includes at a minimum:

  1. The name of the theme and a link to it
  2. The name of the demo/variation being used (if applicable)
  3. The name of the fonts being used and where the web font licence is available from (fonts are licenced separately for web usage)
  4. Hex colours for the colours used in the site

PSD delivery

1. Get the theme PSD file (available for most themes)
2. Review the theme layouts from the theme demo page
3. Prepare the design using layouts from the theme demo using a PSD. Include slides/images within the PSD using layers

PDF delivery

1. Review the theme layouts from the theme demo page
2. Prepare your design using visual layouts based on components from the theme.
3. Provide the assets (logo, slides, images) for OM4 via a Dropbox folder or similar

Slideshow and Parallax Images

When preparing images to use for Slideshows, it is strongly recommended all images should a) use JPG format with quality settings to ensure minimal possible file size without losing image quality; and b) be the same width and height. Images will usually be scaled by the theme to the required width. Note if using a full screen slideshow, slides may be scaled out to 2,560px wide, so JPG images 2560px wide could be a useful size.

Parallax and Slideshow images will often have parts of the image cropped due to automatic cropping by the theme. In general make allowance for 25% of the image (top/bottom and left/right) being cropped at any time. Avoid placing heads or other critical elements outside the central zone of the image.

Mobile usage

Please review the theme demo and visualise the presentation of the website header in mobile mode. If your clients’ logo is ‘thin & deep’, please prepare an alternative mobile-only logo treatment that is ‘wide & shallow’. The mobile only logo will be displayed on narrower displays.

Sagecare-Logo-Stacked-Black-on-Trans

Sagecare-Logo-Wide-Black-on-Trans

Licences

The client should purchase the theme licence. They will then receive the support updates and annual renewal notices.
If you arrange for the theme purchase by the client, ensure you advise OM4 of the login details for the client’s account so OM4 can configure automated application of theme updates (if available).