Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Almost custom - Example design workflow for customising a WordPress website based on a Genesis child theme


Published on

Cath from Phase Creative (Sydney) presented these slides at WordPress Sydney Meetup in Jan 2014. A run through of her workflow demonstrated as a case study. Almost Custom: customising a WordPress website using a Genesis Child theme

Published in: Design, Technology, Business
  • Be the first to comment

  • Be the first to like this

Almost custom - Example design workflow for customising a WordPress website based on a Genesis child theme

  1. 1. Almost Custom’s childs play!
  2. 2. Overview Design workflow for customising a WordPress website using a Genesis Child theme Basic customisation • Typopgraphy • Colours • Integration of logo and logo elements • Images and image treatments • Backgrounds and textures Extras • Custom templates • Custom widgets • Custom functionality PRO TIP: Provide a definition of customisation in your contract and state the limitations of the process
  4. 4. PRO TIP: Create a master to-do list for your sites in asana, duplicate for each site & add/edit as you need
  5. 5. Basic Workflow • Take a design brief • Get content from client (!!) • Discuss structual placement, user journey and devise sitemap • Decide the best child theme base, don’t always show client • Mock up homepage for discussion, make any changes • Mock up internal page(s) for review / revisions • Once approved, set up on MAMP with pre-built plugin set • Build out & upload to staging server (cheapy shared host) • Send link for client to view, get feeback • Build out remaining client content with changes • Test, send link again, make any required changes, test again • Once approved (and paid for), upload to client server for launch
  6. 6. Case Study Maaike Furniture Resurrection Brief: • Existing WordPress blog with over 300 posts spanning 4 years • Time to position as high-end artisan creative • Galleries and blog a focus - wanted grid blog • Needed online quote form • Wanted to look more like a website than a blog • Clean, neutral design so her pieces would sing My one big wish is for a really great gallery page.
  7. 7. Approach • Maaike’s content was ready. She was very organised. • She had a photoshoot done so great photos to work with • I flicked her ‘Foodie’, along with a few others to look at for the bones
  8. 8. “I only really looked at the foodie child theme, and wet my pants with excitement. Design adjustments required • Typography • Colour palette • Imagery Structual changes • New homepage • New gallery template • New newsletter call to action • Blog layed out as a grid
  9. 9. IT’S BEAUTIFUL!!! Everything I imagined. So damn spot on I’m almost disappointed that there’s not a surprise element. And then I saw the sketch details in the top and bottom bars and got a little surprise. And a little teary.
  10. 10.
  11. 11.
  12. 12. Delivery • Make screengrab. I always credit the original designer
  13. 13. Pros • Swift production process, many turn-key elements • Testing has mostly been done on the child theme • Client can see proof of concept before you start • Community help when using well supported framework • You can get familiar with the themes • You can bank your own child themes along the way Cons • Lack of appreciation for the value of the process • Clients misunderstand ‘custom’ to mean ‘bespoke’ so there is an education process • Not as many bells & whistles - managing expectations • You don’t always ‘know’ the code so it can be trial and error
  14. 14. Links & Resources • Foodie theme: • Genesis framework: • Asana: • Adobe Creative Cloud: • MAMP: • Coda 2: • Dynamik by Cobalt Apps: • Firebug: • Invision:
  15. 15. More info • Web: • Twitter: @phasecreative • Email: • Phone: 0402 040 049 • Location: Sydney Cath Beaton is a Sydney based WordPress consultant and web designer with a passion for helping small business professionals maximise their online impact. Thank you :-)