Freelancer Weapons of mass productivity

1,974 views

Published on

In the battle to stay organized, efficient, sane and maximize on billable time it helps to have systems in place to help deal with the daily business processes and management that make sure that you are working on what you should be and that projects, budgets and timelines stay on track. In particular, when you work on your own, its critical to have things like billing, time tracking and project management as a natural and seamless part of your workflow.

This session aims to be a whistle stop tour of some useful open source tools and subscription solutions I have found to be well worth their costs - including how they can be used effectively together to allow you to make the most efficient use of your time designing and developing Drupal sites.

I work as a remote contractor & consultant and my clients are drupal shops and companies needing web sites and systems designed, built, themed and/or maintained. These tools and services work for me to help stay organized and on top of my workload and help me to manage my responsibilities across multiple clients and timezones effectively.

The material in this session is geared more towards individual freelancers although much of it will be relevant for larger drupal shops and teams too.

A few of the topics I intend to cover will include

* Project Management with Redmine - an overview of this powerful open source project management system and a demo of some of the plugins that extend its functionality and integrate well with Drupal, Dropbox, Github, Chrome and others.

* Simplifying getting paid and easy record keeping - Easy invoicing, credit card processing and automatic importing of expenses using Freshbooks & Stripe

* Design to theme tricks and up and coming in-browser design tools and workflows using Styletiles, CSS Hat, SASS, Typekit, Typecast & Livestyle

* Faster Drupal development tips using Alfred & Sublime Text

* Rapid protoyping using Bootstrap/Zenstrap

* Site building strategies using install profiles and drush make files

* Deployment and Maintenance using Aegir

* Server monitoring using New Relic & load testing using Blazemeter

* Hosting and managing your site in the cloud

It is my aim to introduce ( in some cases briefly) tools and services that have made a difference to me that may have the potential to add to and improve your existing workflows.

Published in: Design, Technology
  • Great summary! Thanks
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Freelancer Weapons of mass productivity

  1. 1. Freelance Weapons of Mass Productivity Gregg Coppen http://twitter.com/skabenga http://github.com/iaminawe http://drupal.org/user/218536 http://greggcoppen.com http://iaminawe.com gregg@iaminawe.com
  2. 2. Alfred Drupal API lookup d5 [substring_of_hook] (cached for 365 days) d6 [substring_of_hook] (cached for 365 days) d7 [substring_of_hook] (cached for 30 days) d8 [substring_of_hook] (cached for 2 days) g.d.o dg [nid or group] d.o do [string] - Search projects by name - Open project url with shortname shortname - Open nid doi [project] (Load a project issue page at d.o) dor [project] (Goto drupalcode.org repository page for project) dc [project] (Goto drupalcode.org repository page for project) Search Drupal ds [string to search] - Search Drupal site network for [string] - Search Drupal issues for [string] - Search Drupal groups for [string] Find a user du [user id or name] - Find by Drupal username - Find by IRC nick Drush dd d [command] (a Drush alias with a Drush command command Action - Invokes Drush dd o [command] (a Drush alias Action - Opens the URI associated with the Drush alias in a browser) Alfred is a productivity application for Mac OS X, which aims to save you time in searching your local computer and the web. $30 for power pack that allows using workflows Integrates well with Evernote, Sublime Text, Twitter, Terminal, Finder and many others. http://www.alfredapp.com/ https://github.com/zenorocha/alfred-workflows
  3. 3. Virtualbox • Disposable dev environments • Self contained • Used by vagrant • Useful for IE testing • Don’t use snapshots https://www.virtualbox.org/ http://www.modern.ie
  4. 4. Vagrant Development environments made easy. Create and configure lightweight, reproducible, and portable development environments. http://www.vagrantup.com/ https://drupal.org/project/vagrant
  5. 5. Drush Vagrant Drush Vagrant Integration provides Drush commands to accomplish common Vagrant tasks, and provides a powerful templating framework ('blueprints'). It also has tools to implement Drush aliases for Vagrant projects and VMs, thus allowing simpler remote control of Vagrant projects. https://drupal.org/project/drush-vagrant https://drupal.org/project/drupal-up https://drupal.org/project/aegir-up
  6. 6. Digital Ocean • Excellent control panel • Very cheap prices • Great support • Ridiculously fast • Tugboat command line control • Great documentation & articles https://www.digitalocean.com https://github.com/pearkes/tugboat https://www.digitalocean.com/?refcode=1765785d0ea1 If you use the link below I will get $10 free hosting :)
  7. 7. Linode • Clear control panel • Reasonable pricing • Excellent support • Fast & Reliable • Great articles & resources • Frequent surprise upgrades https://www.linode.com/
  8. 8. Deployment & Maintenance Aegir allows you to deploy and manage many Drupal sites, and can scale across multiple server clusters. Aegir makes it easy to install, upgrade, and backup an entire network of Drupal sites. Enforces best practices site building using drush make, features and install profiles Comes in several tasty flavours Vanilla, BOA & Devshop https://drupal.org/project/hostmaster https://drupal.org/project/barracuda https://drupal.org/project/octopus https://drupal.org/project/devshop
  9. 9. Redmine • Project Management, issue and time tracking • Is extendable with an active ecosystem of useful plugins and themes • Is easy to get issue tickets into with multiple approaches • Offers a structured but flexible approach to managing projects • Is versatile with per project modules and custom fields and trackers. http://www.redmine.org/ http://bit.ly/1cCRPNr - 1 click installer
  10. 10. Redmine: Workflow • Create project and assign members • Create a target version and set a deadline • Create issue • Assign task • Set Deadline • Set Target Version • Work on issue until ticket is closed • Close all issues to reach target version
  11. 11. Redmine: issues input • Through project manager interface • Via Drupal site with Feedmine • New issues/Responses by e-mail • Batch issue import from spreadsheet • Via chrome extensions • Via iphone/ipad apps using the Redmine api https://drupal.org/project/feedmine http://www.redmine.org/plugins/issuefy http://getredmineapp.com/
  12. 12. Redmine: Extendability • http://www.redmine.org/plugins/redmine-dashboard • http://www.redmine.org/plugins/zenedit • http://www.redmine.org/plugins/redmine_dropbox_attachments • http://www.redmine.org/plugins/clipboard_image_paste • http://www.redmine.org/plugins/redmine_spent_time • http://www.redmine.org/plugins/redmine_charts2 • http://www.redmine.org/plugins/monitoring-controlling • http://www.redmine.org/plugins/issue_checklist • https://bitbucket.org/akiko_pusu/redmine_issue_templates • http://www.redminecrm.com/projects/questions • http://github.com/techarete/redmine_timesheet_plugin • http://www.redmine.org/plugins/status_button You will need up upgrade Ruby to a more recent version for many of these to work.
  13. 13. Github • Hosted git repositories • Edit files from any device • Need to pay for private repositories • Can interact with redmine via post commit hooks • Can also be used for issue tracking/documentation • Active community for open source projects • Makes it easy to follow and track other projects • Developer friendly tools http://github.com/
  14. 14. Gitlab • Self hosted github clone • Edit files from any device • Unlimited private repositories • Can be on same server as redmine • Redmine Issue crosslinking and syncing • Can also be used for issue tracking & documentation http://www.gitlab.com/
  15. 15. Twitter Bootstrap Sleek, intuitive, and powerful front-end framework for faster and easier web development. http://www.getbootstrap.com
  16. 16. Advantages • Fast to prototype with • Robust & battle tested • Platform agnostic and cross browser • Expanding eco-system of resources • Responsive and mobile first • LESS & SASS versions exist Disadvantages • Unsemantic grid classes • Potential jquery conflicts with Drupal • Can be heavy - 458kb if using everything • Sites look similar if left with default styling • Uses Less by default but sass versions exist
  17. 17. Bootstrap Theme https://drupal.org/project/bootstrap • Supports Bootstrap 3 • Uses CDN or local js files • Quick to implement within Drupal. • Uses Less • Includes the bootswatch.com drop in css replacement files
  18. 18. ZenstrapTheme Zenstrap is a drupal theme is based on the Zen theme and Twitter Bootstrap  •The following is supported out-of-the-box •Accordion Menus •Message box can be closed •Modal box for Login •Modal box for any url •Drop down Menus •Horizontal Forms •SASS based stylesheets https://drupal.org/project/zenstrap
  19. 19. Free web-based interface building tool for Twitter Bootstrap. http://layoutit.com
  20. 20. Design elements and code snippets for Bootstrap HTML/CSS/JS framework Awesome for quick mockup elements http://bootsnipp.com
  21. 21. Customizing Bootstrap Its just css
  22. 22. Drop in bootstrap css file replacement http://bootswatch.com
  23. 23. Bootstrap css stylesheet generator http://stylebootstrap.info
  24. 24. Style Tiles A visual web design process for clients and the responsive web Style Tiles are a design deliverable consisting of fonts, colors and interface elements that communicate the essence of a visual brand for the web. They help form a common visual language between the designers and the stakeholders and provide a catalyst for discussions around the preferences and goals of the client. http://styletil.es/ http://alistapart.com/article/style-tiles-and-how-they-work http://samanthatoy.com/washington-examiner/
  25. 25. Static Style Tiles • Improvement on full mockups • Still labor intensive to produce • Usually done with Photoshop • Type looks different in PS to HTML • Not easy to make changes • Still needs to be converted to css
  26. 26. Static Style Tiles • Improvement on full mockups • Still labor intensive to produce • Usually done with Photoshop • Type looks different in PS to HTML • Not easy to make changes • Still needs to be converted to css
  27. 27. The site outcome after using style tiles to define design directions http://canadiandistribution.ca
  28. 28. Dynamic Style Tiles Andrea Burtons session at PNWDS 2012 • HTML Based Style Tiles • Drupal orientated class names • Foundation for Responsive framework • SASS makes it easy to theme http://abelb.github.io/drupal_styletiles/
  29. 29. Styling Tiles Distro https://github.com/iaminawe/stylingtiles-profile An install profile I have been working on • Drupal based Style Tiles • Intended for creating quick variations • Can be used by designers • Can be extended with custom css • Uses Bootstrap 3 • LESS Preprocessing • Responsive & Mobile first
  30. 30. $50 a year Supports the foundries and designers http://typekit.com
  31. 31. Typecast.com Is a commercial (optional) service but useful for fine typography control in the browser • Opentype ligature features • Vertical rhythm grid • Fonts from many providers • Generates the css
  32. 32. Livestyle Live edit your production web-site with original CSS source • No file saving, no page reloading • You need only web browser and editor for live editing • No special web-server or file watcher required. • It doesn't matter where your CSS file comes from • Use multiple windows to tweak responsive design http://livestyle.emmet.io/
  33. 33. Sublime Text • Integrates well with Livestyle & Alfred • Drupal packages extend • Snippets implementation • Takes some time to learn • Extensive ecosystem of additional plugins • Installed through a slick package manager • Quick to open, close and work with http://www.sublimetext.com/ https://github.com/kostajh/subDrush https://github.com/robballou/drupal-sublimetext
  34. 34. Freshbooks • Automated expense imports • Multiple Currencies • Payment Reminders & Notifications • Recurring Invoices • Late Fees reminders and penalties • Integrates with several payment gateways • Range of useful reports for tax time http://freshbooks.com
  35. 35. Stripe • Get up an running almost immediately • Transfers directly to bank account • Takes about 7 days to clear into account • 2.93% Fee and 30c per transaction • Integrates well with Drupal through ubercart and commerce modules https://stripe.com
  36. 36. New Relic • Great for Drupal Performance troubleshooting • Free plan offers useful server and app metrics • Easy to set up on any server • Central dashboard to monitor multiple servers • Integrates well with BOA • Notifications via multiple channels • Free T-shirt when you install http://newrelic.com https://drupal.org/project/new_relic_rpm
  37. 37. Blazemeter Instant load testing platform that lets developers focus on developing. Start testing right away. Simulate any user scenario for webapps, websites, mobile apps or web services. 100% Apache JMeter™ compatible. Scalable from 1,000 to 100,000 concurrent users. http://blazemeter.com/ https://drupal.org/project/blazemeter
  38. 38. Thanks Questions? http://twitter.com/skabenga http://github.com/iaminawe http://drupal.org/user/218536 http://greggcoppen.com http://iaminawe.com gregg@iaminawe.com

×