Drupaldelphia  Shortcuts Cheats And Cheap Stunts
Upcoming SlideShare
Loading in...5
×
 

Drupaldelphia Shortcuts Cheats And Cheap Stunts

on

  • 2,463 views

Mason Wendell's presentation from DrupalCamp Philadelphia (Drupaldelphia)

Mason Wendell's presentation from DrupalCamp Philadelphia (Drupaldelphia)
July 31, 2009

Statistics

Views

Total Views
2,463
Slideshare-icon Views on SlideShare
2,375
Embed Views
88

Actions

Likes
2
Downloads
20
Comments
0

3 Embeds 88

http://www.canarypromo.com 61
http://www.drupaldelphia.com 26
http://birdsandmonkeys.com 1

Accessibility

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Drupaldelphia  Shortcuts Cheats And Cheap Stunts Drupaldelphia Shortcuts Cheats And Cheap Stunts Presentation Transcript

    • Shortcuts, Cheats and Cheap Stunts! Rethink your workflow to fix a lame design and rock your theme development. Mason Wendell, Canary Promotion + Design
    • This session is not about Drupal.
    • It’s about overcoming Drupal. Yes, I know it’s being redesigned. :) Drupal.org
    • Drupal is just one tool we use. ✤ A List Apart ✤ Boag World ✤ Armies of blogging designers ✤ Design for Drupal http://groups.drupal.org/d4d
    • Dealing with Drupal Markup & Wild Wild West of Contrib While still making pretty sites
    • Design/Theming Workflow Where to start? ✤ Inspiration ✤ Started a design ✤ Wireframes ✤ Mindmap (mindmeister.com)
    • Design Assumptions ✤ We like legible type. ✤ It will have some configuration of columns. ✤ We might as well establish a vertical rhythm.
    • Plenty of Room for Creativity Lace in Translation
    • Plenty of Room for Creativity Bristol Riverside Theatre Company
    • Plenty of Room for Creativity Drupal.org Redesign Mark Boulton Design
    • Know Where You’re Going ✤ What are you designing for?
    • Know Where You’re Going ✤ What are you designing for? ✤ <div>Markup!</div>
    • Know Where You’re Going ✤ What are you designing for? ✤ <div>Markup!</div> ✤ Nodes, Blocks, Views
    • Know Where You’re Going ✤ What are you designing for? ✤ <div>Markup!</div> ✤ Nodes, Blocks, Views ✤ You can override any markup, but to you have to?
    • Know Where You’re Going ✤ What are you designing for? ✤ <div>Markup!</div> ✤ Nodes, Blocks, Views ✤ You can override any markup, but to you have to? ✤ Sometimes
    • CSS Frameworks ✤ Blueprint CSS (blueprintcss.org) ✤ 960.gs
    • CSS Frameworks ✤ Blueprint CSS (blueprintcss.org) ✤ CSS reset ✤ Solid yet flexible grid system ✤ Sensible typography defaults ✤ Form styles ✤ Print stylesheet ✤ Thriving open-source project
    • How Blueprint Works
    • Blueprint Tools ✤ http://kematzy.com/ blueprint-generator/ ✤ http://toki-woki.net/p/Boks/ ✤ http://bluecalc.groupion.com/ ✤ http://constructyourcss.com/
    • Apply to Photoshop http://www.canarypromo.com/birdfeed
    • Build Your Site
    • Build Your Site ✤ We’re skipping development. Everyone else today has you covered.
    • BONUS: Use Drush http://drupal.org/project/drush
    • Theming Applying Your Design & Grid
    • Wireframe Your HTML ✤ Paper ✤ Boks or other tool ✤ Hand-code HTML
    • Now, Back to Drupal We are at DrupalCamp, after all.
    • What Starter Theme? ✤ Zen http://drupal.org/project/zen ✤ Stark http://drupal.org/project/stark ✤ Studio http://drupal.org/project/studio ✤ Roll your own
    • What Starter Theme? ✤ Zen http://drupal.org/project/zen ✤ Stark http://drupal.org/project/stark ✤ Studio http://drupal.org/project/studio ✤ Roll your own
    • What Starter Theme? ✤ Zen http://drupal.org/project/zen ✤ Stark http://drupal.org/project/stark ✤ Studio http://drupal.org/project/studio ✤ Roll your own
    • What Starter Theme? ✤ Going w/ a stripped down Zen ✤ Zen is very well documented
    • What Starter Theme? ✤ Going w/ a stripped down Zen ✤ Override most theme and system CSS ✤ Zen is very well documented ✤ THEMENAME.info
    • What Starter Theme? ✤ Going w/ a stripped down Zen ✤ Override most theme and system CSS ✤ Zen is very well documented ✤ THEMENAME.info
    • Putting it Together HTML Wireframe
    • Putting it Together Page Template
    • Putting it Together Unstyled HTML
    • Putting it Together Just Blueprint CSS
    • Putting it Together Finished Site
    • Tools in Drupal Drupal Theming Modules ✤ Devel http://drupal.org/project/devel ✤ theme developer
    • Tools in Drupal Drupal Theming Modules ✤ Devel http://drupal.org/project/devel ✤ theme developer ✤ dsm() + Krumo
    • Tools in Drupal Drupal Theming Modules ✤ Devel http://drupal.org/project/devel ✤ theme developer ✤ dsm() + Krumo ✤ Admin Module http://drupal.org/project/admin
    • Tools in Drupal Drupal Theming Modules ✤ Devel http://drupal.org/project/devel ✤ theme developer ✤ dsm() + Krumo ✤ Admin Module http://drupal.org/project/admin ✤ Custom Show Grid Module
    • Tools in Drupal Drupal Theming Modules ✤ Devel http://drupal.org/project/devel ✤ theme developer ✤ dsm() + Krumo ✤ Admin Module http://drupal.org/project/admin ✤ Custom Show Grid Module canarypromo.com/birdfeed/category/drupaldelphia
    • Browser Tools ✤ Firebug (Firefox) ✤ Firebug Lite (others) ✤ Inspector (webkit)
    • Totally Control Markup & CSS Plus the power of Drupal. Pretty sweet.
    • BONUS: Compass / SASS Syntactically Awesome Style Sheets Http://compass-style.org/
    • Shortcuts, Cheats and Cheap Stunts! Rethink your workflow to fix a lame design and rock your theme development. Mason Wendell, Canary Promotion + Design http://canarypromo.com http://canarypromo.com/birdfeed/category/drupaldelphia http://twitter.com/canarymason http://blueprintcss.org http://960.gs http://drupal.org/project/studio http://drupal.org/project/zen http://drupal.org/project/stark http://drupal.org/project/drush http://drupal.org/project/devel http://drupal.org/project/admin http://compass-style.org