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

Ballin' On A Budget: How to create great design...

Josh Riggs
January 21, 2015

Ballin' On A Budget: How to create great design an nearly any cost

After spending several years designing large-scale responsive websites for Fortune 500 companies with mega-budgets, I now specialize in design for progressive non-profit organizations. The good news is that we can still create kick-ass design for any budget as long as we utilize solid design fundamentals, great communication, and a few tricks up our sleeves.

Josh Riggs

January 21, 2015
Tweet

More Decks by Josh Riggs

Other Decks in Design

Transcript

  1. Designing On A Budget: • Why Talk About Money? •

    Ideas Are Free* • Budget Killers & How to Avoid Them • Final Thoughts & Resources
  2. • Creative Director • Senior Graphic Designer • Graphic Designer

    • Product Designer • UI Designer • Production Designer • Videographer • Copywriter • 3 Front End Engineers 11 Full Time Design-Ish Employees
  3. If Time = Money, How Can We Work More Efficiently

    And Still Create Great Design?
  4. • Good typography creates a high-end, elegant feel • Proper

    line-height / leading makes reading easy • Hierarchy of text (headings, body copy, quotes, etc.) will effortlessly lead users to where we want them to go. Good Typography
  5. • Color treat your damn photos! • Presets like VSCO

    (vsco.co) are great! Simple Image Editing & Color Treatment
  6. • Technical underestimation • Inconsistencies in design • Misguided design

    deliverables • Bad communication 4 Breeds Of Budget Killers
  7. On a scale of 1 - 10, how hard will

    it be for you to build this?
  8. Always code as if the guy who ends up maintaining

    your code will be a violent psychopath who knows where you live. - Martin Golding
  9. Always design as if the guy who ends up coding

    your designs will be a violent psychopath who knows where your desk is. - Me
  10. 16 x 9 16 x 9 Really Fuckin’ Wide 1

    x 1 1 x 1 16 x 9 16 x 9 16 x 9 16 x 9
  11. • Designing the wrong things • Creating too many design

    deliverables • Not designing enough • Jumping into designs too quickly Examples:
  12. • Content Slice Diagrams • Wireframes • Prototypes Deliverables at

    ThinkShout: • Style Tiles • Visual Inventories • Visual Design in Browser • Visual Design in Sketch • Codepens
  13. Process at ThinkShout: • Start broad, then work down to

    details. • Turn business goals and content into something a human can use.
  14. • Front loading design only at the beginning of a

    project • What happens if something needs design, and your design budget is gone? Example:
  15. • Wireframes and prototypes can be ugly • Obsessing over

    pixels in responsive design is futile • Shipped is better than perfect Let Go Of Pixel Perfection
  16. • Zurb Foundation, Bootstrap, etc. • Usually includes a lot

    of shit you don’t need • Great for using out of the box, but a giant pain to customize • Can be a nightmare to use with a CMS like Drupal • I recommend for prototyping only. Beware Of The Framework
  17. • Set aside some non-billable time to keep up with

    trends and inspiration • An hour here and there on a project really adds up • Be proactive on research and inspiration • Chrome Panda Plugin Stay Inspired & Knowledgeable
  18. • Your design skills need to be exercised • Daily

    Sketches • Daily Treehouse lessons Daily Exercises
  19. • Sketching quick ideas before jumping into code or Photoshop

    saves you time • Show quick sketches to your clients or your team to get quick feedback • You can even make your sketches interactive using Invision (invisionapp.com) Sketch Like A Mofo
  20. • Google Fonts: google.com/fonts • League of Movable Type: theleagueofmoveabletype.com

    • Lost Type: losttype.com • Font Squirrel: fontsquirrel.com Typefaces:
  21. • The Stocks: thestocks.im • Unsplash: unsplash.com • Death To

    The Stock Photo: deathtothestockphoto.com Free Photos