The One with the Color Picker in Chrome DevTools

I was today years old when I learned that there is a color picker available within Chrome DevTools.

I was making tweaks to the homepage of my website. I use Bootstrap with some custom styling which was making for some weird spacing on larger screen sizes. I was debugging where the extra height was coming from by adding obtrusive background colors to all div elements.

Usually, I inspect an element and double-click it’s hex value in the styles panel to manually make a change. By mistake, I clicked the small color square next to the hex value and—whoa—a wild color picker has appeared!

Example of using Chrome DevTools to change a hex value
An example of using Chrome DevTools to change the hex value of a CSS property value

Pretty cool right?

In playing around with the tool some more, I see that you can use an eyedropper to pick out new colors, toggle the color values from RGA, hex, and hsla and even pick colors from the material design color palette.

This is great news for someone like me who wants needs to debug in the browser or wants to test new colors without opening up a text editor.

Here’s Google’s documentation on the tool and other CSS Reference features.

Chrome DevTools | CSS Reference

The One Where I Did an AMA on Open Source

It’s Fall. The leaves are changing. The weather is getting colder.

Hacktoberfest is coming.

Open source is an exciting thing. It can also be intimidating. I spoke about my open source experiences at Codeland and a lot of attendees had similar stories or questions.

Inspired by the good folks at dev.to, I decided to open myself up to an AMA (ask me anything) on the topic of creating and managing my first open source project.

The AMA can be found here. I’ll also welcome questions via email, my blog or on Twitter.

Stay spooky.

The One About Twitter Tech Chats

I enjoy participating in Twitter Chats.

Sometimes, I forget when my faves are, or, forget to flag new ones to check out later.

So, to help keep them all in one place (and to discover more) I created a Twitter Tech Chat repo on Github with a list of some of the tech-related Twitter chats on my radar.

This repo will evolve over time, but for now, it works.

If there’s a tech chat you regularly tune into that’s not on the list, open a pull request and get it added.

Photo by Slava Bowman on Unsplash

Talk: Guide Your Team with an Email Playbook

Thanks for attending my talk, Guide Your Team with an Email Playbook, at Litmus Live! Links to related resources can be found below.

Let’s stay connected and keep the #emailgeek and #litmuslive conversations going!

Guide Your Team with an Email Playbook – San Francisco (General Track)

Resources

User Story – What is a user story?
Validate or Die: Using Validation to Build the Right Product – Why and how you should validate your product
The Practical Guide to Creating Empathy Maps – Detailed article from UXPin about empathy maps in the user persona process
What is an Empathy Map? – Agile guide from Solutions IQ outlining how to create an empathy map

Other Resources

The Lean Startup Methodology
Manifesto for Agile Software Development
Riker Ipsum

Takeaways

Guide Your Team with an Email Playbook (Takeaways) [29KB] – A shorten slide deck, featuring just fun stuff—I mean—key takeaways seen below

  • An email style guide is useful for developers, but may not be as relevant for marketers
  • An email playbook has the potential to add value for development and marketing
  • Getting buy in from development, marketing, leadership, etc will set you up for success
  • A user story framework can help articulate business value
  • Audit your emails and existing content to see trends, gaps and education opportunities
  • Validate your concept and iterate as you go
  • Socialize your playbook with your department, company or team
  • Have a plan for keeping your email playbook up-to-date

Guide Your Team with an Email Playbook – Boston (Developer Track)

Presentation Slides [5 MB] – Presentation slides from Litmus Live talk in Boston

If you have questions about this process or would like to know more, see me at table #10 during the Ask an Expert session on Tuesday and Wednesday. Or, shoot me an email.

Resources

The Practical Guide to Creating Empathy Maps – Detailed article from UXPin about empathy maps in the user persona process
What is an Empathy Map? – An agile guide from Solutions IQ outlining how to create an empathy map

Email Playbook & Workflow

Presentation Slides [2.6 MB] – Slides from my mini-talk during the Reinvent Your Email Workflow workshop

Resources

Mint Email Examples –One, two and three product promotion examples from Mint
Remember Santeria by Sublime – Spiffy use of an animated gif from Spotify
18 Email Stats to Quote at Parties – I’m 100% quoting these stats from Emma at parties
Bad Behavior – Another fly newsletter example from The Outline
Value Stream Mapping – Helpful exercise in identifying wait times and pain points in your workflow
The Practical Guide to Creating Empathy Maps – Detailed article from UXPin about empathy maps in the user persona process
What is an Empathy Map? – Agile guide from Solutions IQ outlining how to create an empathy map

All images, unless otherwise noted, are from Unsplash