Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Extreme Theme Makeover - WordCamp Reno 2013

Megan Gray
April 27, 2013

Extreme Theme Makeover - WordCamp Reno 2013

Whether you need to create something totally unique for your client on a budget, build a site that “doesn’t look bloggy,” or just want something that has that “wow” factor, theme customizations are a great time-saving, cost-effective option. Why reinvent the wheel when you can just make it beautiful?

Megan Gray

April 27, 2013
Tweet

Other Decks in Design

Transcript

  1. EXTREME
    THEME
    MAKEOVER

    View full-size slide

  2. MEGAN GRAY
    Designer
    wordpresser
    Beach bum
    @houseofgrays | itsmegangray.com | 10up.com

    View full-size slide

  3. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    CUSTOMIZING off-the-shelf THEMES
    it’s not cheating. it’s winning.
    »
    » When you’re just beginning

    View full-size slide

  4. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    CUSTOMIZING off-the-shelf THEMES
    it’s not cheating. it’s winning.
    »
    » When you’re just beginning
    »
    » When you’re short on time, budget,
    or resources

    View full-size slide

  5. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    CUSTOMIZING off-the-shelf THEMES
    it’s not cheating. it’s winning.
    »
    » When you’re just beginning
    »
    » When you’re short on time, budget,
    or resources
    »
    » When you want to work smarter,
    not harder

    View full-size slide

  6. use both halves
    to control creative chaos.

    View full-size slide

  7. eat your vegetables first.

    View full-size slide

  8. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    good DESIGN SOLVES PROBLEMs
    It doesn’t make problems prettier.
    »
    » People don’t visit sites for the design

    View full-size slide

  9. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    good DESIGN SOLVES PROBLEMs
    It doesn’t make problems prettier.
    »
    » People don’t visit sites for the design
    »
    » Always begin with a plan

    View full-size slide

  10. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    good DESIGN SOLVES PROBLEMs
    It doesn’t make problems prettier.
    »
    » People don’t visit sites for the design
    »
    » Always begin with a plan
    »
    » Make it smart before you make it pretty

    View full-size slide

  11. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    HAVE A PLAN
    Design without a plan is just doodling.
    1. Take inventory of your content
    (present & future)

    View full-size slide

  12. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    HAVE A PLAN
    Design without a plan is just doodling.
    1. Take inventory of your content
    (present & future)
    2. Define required features

    View full-size slide

  13. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    HAVE A PLAN
    Design without a plan is just doodling.
    1. Take inventory of your content
    (present & future)
    2. Define required features
    3. Complete a creative brief

    View full-size slide

  14. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    you need help
    Get it early and often.
    1. Find a trusted WordPress consultant

    View full-size slide

  15. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    you need help
    Get it early and often.
    1. Find a trusted WordPress consultant
    2. Share your plan

    View full-size slide

  16. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    you need help
    Get it early and often.
    1. Find a trusted WordPress consultant
    2. Share your plan
    3. Preventing fires > Putting them out
    (or watching your site burn)

    View full-size slide

  17. do a warm up lap.

    View full-size slide

  18. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    find your Inspiration:
    It feels like a cold slap in the face, by the way.
    »
    » Consult the creative brief

    View full-size slide

  19. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    find your Inspiration:
    It feels like a cold slap in the face, by the way.
    »
    » Consult the creative brief
    »
    » Sources: Everywhere. Magazines. Internet.

    View full-size slide

  20. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    find your Inspiration:
    It feels like a cold slap in the face, by the way.
    »
    » Consult the creative brief
    »
    » Sources: Everywhere. Magazines. Internet.
    »
    » Save it for later: Pinterest, Gimme Bar

    View full-size slide

  21. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    shopping for themes
    It’s like dating. Kind of*.
    »
    » Find one that comes from a good family
    *Dating is awful. Theme shopping is mostly pleasant.

    View full-size slide

  22. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    shopping for themes
    It’s like dating. Kind of*.
    »
    » Find one that comes from a good family
    »
    » Don’t expect it to change after you buy it
    *Dating is awful. Theme shopping is mostly pleasant.

    View full-size slide

  23. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    shopping for themes
    It’s like dating. Kind of*.
    »
    » Find one that comes from a good family
    »
    » Don’t expect it to change after you buy it
    »
    » You’ll know when you find the one.
    *Dating is awful. Theme shopping is mostly pleasant.

    View full-size slide

  24. you may now open photoshop

    View full-size slide

  25. designers are a
    maddening combination
    of competitiveness
    and insecurity.
    -mike monteiro

    View full-size slide

  26. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    the design process
    (The parts nobody talks about)
    At least once in every good design process, you may:
    »
    » Doubt yourself

    View full-size slide

  27. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    the design process
    (The parts nobody talks about)
    At least once in every good design process, you may:
    »
    » Doubt yourself
    »
    » Rage Quit your computer

    View full-size slide

  28. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    the design process
    (The parts nobody talks about)
    At least once in every good design process, you may:
    »
    » Doubt yourself
    »
    » Rage Quit your computer
    »
    » Delete everything and start over

    View full-size slide

  29. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    the design process
    (The parts nobody talks about)
    At least once in every good design process, you may:
    »
    » Doubt yourself
    »
    » Rage Quit your computer
    »
    » Delete everything and start over
    Everyone does this. This is Good.

    View full-size slide

  30. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    design in the details
    Think big, work small.
    1. Color Palette
    2. Typography
    3. Background
    4. Header
    5. Navigation
    6. Content Area
    7. Sidebar
    8. Footer

    View full-size slide

  31. 4
    5
    8
    6 7
    3
    AaBbCc
    1
    2
    Color Palette
    Typography
    Background
    Content Sidebar
    Header
    Navigation
    Footer

    View full-size slide

  32. Carolyna Pro
    Josefin Slab
    5
    6
    7
    8
    1
    2 3
    4

    View full-size slide

  33. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    designers’ block
    How to smash it.
    »
    » You can always afford 5 minutes

    View full-size slide

  34. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    designers’ block
    How to smash it.
    »
    » You can always afford 5 minutes
    »
    » Play

    View full-size slide

  35. ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    designers’ block
    How to smash it.
    »
    » You can always afford 5 minutes
    »
    » Play
    »
    » Revisit your inspiration

    View full-size slide

  36. learn to code
    (you can do it)

    View full-size slide

  37. graphics
    »
    » TheInkNest.com
    »
    » CreativeMarket.com
    »
    » iStockphoto.com
    colors
    »
    » color.hailpixel.com
    »
    » colourlovers.com
    »
    » kuler.adobe.com
    textures
    »
    » lostandtaken.com
    »
    » subtlepatterns.com
    »
    » flickr.com
    typography
    »
    » typecast.com ($)
    »
    » typekit.com ($)
    »
    » google webfonts

    View full-size slide

  38. learnin’
    »
    » codeschool.com
    »
    » codeacademy.com
    »
    » dontfeartheinternet.com
    »
    » lynda.com
    »
    » hackdesign.org
    organizaiton
    »
    » teuxdeux.com
    »
    » workflowy.com
    »
    » app.weekplan.net
    inspiration
    »
    » real life!
    »
    » puglypixel.com
    »
    » dribbble.com
    »
    » pinterest.com
    »
    » webcreme.com
    »
    » awwwards.com

    View full-size slide

  39. work smarter.

    View full-size slide

  40. have a plan.

    View full-size slide

  41. stick to the plan.

    View full-size slide

  42. be fearless.
    -andrea rennick

    View full-size slide

  43. this is the best job
    in the world!
    let’s do it right.
    -MIKE MONTEIRO

    View full-size slide

  44. @houseofgrays
    speakerdeck.com/houseofgrays

    View full-size slide