Over the past nine months, our design team has been using Photoshop CC’s artboards feature (new with CC 2015). If you’re not familiar, artboards allow you to create multiple canvases within a single Photoshop file. While we had used artboards in Illustrator, the shift in Photoshop wasn’t a breeze. In the short term, artboards disrupted our keyboard-shortcut habits and file management workflow. Multiple design concepts and dozens of artboards later, they’re a part of every new design system we create.
We’ve written 3 blog posts about tools. View all topics »
I recently came off a huge project in which I was responsible for front-end code that had me knee-deep in a singular codebase for seven, count ’em, seven months. ’Twas fun—no complaints. In fact, I really enjoyed the work, but when I found out the next project in the pipeline was a one-page marketing microsite with a quick turnaround time, I got super excited for the learning/implementing opportunity a project of this scale provided.
As a designer, my involvement in projects’ front-end development varies. Sometimes, I spend most of my time in code; other times, I work solely in Photoshop. But, there is one part of every front-end engagement that I always love to jump into the browser for: to create hover animations.
Hover animations are a site design element just like typography and color, so it’s important that designers take ownership of this step. Not only do hovers add to the look and feel of a site, but they also add an extra layer of usability for users with a mouse. A finished site may “work” without them, but these nuanced touches add polish and really reinforce a site’s personality. I like to think of their addition as “bonus design”—it’s an opportunity to better what’s being built.