14
Jan

A case for design systems

Posted by: Calvin Chopp

How design systems enable a tighter focus on what matters

I’d recently stumbled onto a thread on Twitter where one of the tweeters twittered (ok, I’ll stop) that current-day digital designers are no more than glorified digital “scrap bookers”— taking pieces and parts from things already created to slap something together and call it their own. The original arguer was making his case that modern-day digital products (and in turn producers) have become lazy and complacent, and are stifling design innovation. I understand the frustration this individual was feeling, though my experience may be different. I just think the complaint misses a larger point.

Let’s look at the ‘glorified scrap booker’ argument, this idea that most sites or digital products now produced are a smattering of already-set frameworks, APIs, code snippets, and repos that should work together to create something, as opposed to something uniquely created from scratch for a single purpose. I admit that there’s some truth to this. For instance, our agency leverages Boostrap‘s core for many of our projects (among other tools). This in turn gives us access to many UI components and built-in experience mechanisms and default styling that can be adjusted to fit the specific project need. It also allows us to quickly prototype and help make first-pass iterations on projects in a timely, and more affordable fashion.

There are dozens of common frameworks similar to Bootstrap that serve a similar purpose, such as Materialize CSS, Semantic UI, Material UI, UIkit and Foundation. Take your pick. Most offer similar functionality and serve similar purposes. Like any tool, they’re only as effective as the particular implementation.

Our goal with using such tools isn’t to diminish product value by using preset functionality. It’s to reduce effort on the mundane task of building things that can be shared or re-used, and focusing attention instead on the client’s/user’s specific issue or project goals to create something that suits the need.

It may be helpful to think of houses and what makes a house a home.

At a macro-level, when you look at a neighborhood of houses, everything seems the same. Think about when taking off on an airplane, and you look down and see all the rooftops. There’s some amount of truth to this. The majority of houses all have a basic, similar framework. You have a roof, windows that (normally) open and close, a door at the front, and at least four walls holding it all up, with separate rooms within that each serve a purpose. We all use or benefit from the ‘standard’ house and all its out-of-the-box ‘functionality’ and uses. Door frames all share a set of sizes that they might come in. You can expect ceiling heights to fall into a certain range. You could remove the ceiling fan from one house and reinstall it in the next with little or no question of how to make that adjustment. This similarity and sharing of general features and parts is intentional to allow for more efficient, affordable building and maintenance, while still giving the owner choice to make this house their home.

While a basic house framework is shared by all, there’s still the opportunity within these constraints to use those components to make something specifically tailored to the “user”. Looking at a more detailed view of a house, we see that people make it their own, either on their own (thanks Chip and Joanna) or with the aid of an architect/interior designer/contractor. We paint and remodel. Decorate and stage. Some hire builders to come in and take these general concepts of the house structure, and custom tailor that into home exactly to the owner’s requirements.

A great example of someone who took the foundation of a structure and then tailored it to the individual is Franklin Lloyd Wright.

Photo: Andrew Pielage © Frank Lloyd Wright Foundation

Wright was famous for taking every detail into account for his clients when it came to making his houses into homes, down to the smallest detail. He was known to take into consideration the height of his client when determining the height of things like the windows, counters and even the furniture that he’d have made, so that line of sight, working heights and how a person lived in the home was completely tailored to that person. He worked with his clients to sort out exactly what was needed to make the project successful. Wright’s empathic and independent perspective played such a crucial role in the success of his designs, and is why he’s considered one of most prominent architects of a generation. Wright considered the “end user”, used general, shared frameworks and concepts, and then applied his ability to communicate design decisions tailored to his customer, which ultimately led to his success and timeless designs. Wright’s ability to harness the frameworks that he worked within while understanding his customer helped pave the way for not only his personal success, but also allowed him to innovate and drive architectural design forward.

Charles and Ray Eames, as described by Eames Demetrios in the book The Eames Primer describes our roles as designers well:

 “… the role of the architect, or the designer, is that of a very good, thoughtful host, whose energy goes into trying to anticipate the needs of his guests…We decided that this was an essential ingredient in the design of a building or a useful object.”

Our roles as designers and our relationship with our clients is one that we’re to use our tools and skills in such a way that when we take into account our end products, we’re doing so with an anticipation the end-user, how our products functionality effects its intended use, how scalability and maintainability of the project plays into all of it.

Freeing Ourselves to Focus on Expected Usability

Another benefit to leveraging tools and frameworks is that it allows us to then focus on other important, user-focused ideas like expected usability. Certain things that we do have an expectation of what the outcome should be once it’s completed. If we turn a door knob, we expect a door to open. A water knob that’s labeled with a blue sticker should pour out cold water.

Like a home, digital products have these same considerations that we need to account for. A user understands what a content tab is, and there’s an expectation behind what will happen when a tab is clicked. Buttons are expected to do a certain thing when clicked. We’re even seeing a meshing of experiences between applications and other SaaS products with websites and other traditional digital platforms as users become more ingrained with navigating a digital world. Users are becoming more proficient, but this shift also means that we have larger audiences to account for, and the need for focusing on consistency in user experience and usability in our products is going to only increase.

How irritating is it when you come to a door with a handle that clearly is meant to be grasped and pulled, but you need to push it open for it to work? There’s an expected usability to the world around us. Bonus PSA. If you need signage or basic instructions for these types of interactions, you can do your experience better.

A Case For Design Systems

Over the past number of years, I’ve noticed a rise in discussion around design systems, and see more and more companies integrating these into their DNA. Google’s Material Design is a good example. Apple has its Human Interface Design standards. Even the U.S. Government has their own design system.

In its simplest definition, a design system is a collection of design rules, constraints and principles that are implemented and managed by design and code.

What a design system is not is just a style guide (though a style guide may be used as part of a design system). It’s also not a pattern library, and not just a front-end framework.

What is a Design System?

In a very basic sense, a design system is the classification of components, along with the process that is built and maintained by the company to help develop a superior user experience, and to strengthen the companiy’s overall brand perception.

A design system takes into account those expected usability considerations in the form of components, cohesive design, as well as tone and voice with how content is presented. When they’re executed well, it helps to eliminate users ‘pulling when they should push’, which in turn increases their overall experience with your product, while also helping to minimize design and development debt. When we integrate tools like were described earlier as well, we’re able to further reduce that design and development debt.

But, I Can’t Afford to Allocate Resources to This…

Although I hope you can see how a design system being implemented is important and that there’s value in proactively looking at how and why you’re designing and developing your digital product, I get it… putting together a thought-out, documented design system takes time, resources and money.

Before you completely shrug off the idea that you could afford having a design system be a part of your project, think about the cost of not at least taking these thoughts into consideration.

Design Systems Reduce Design and Development Debt

When we’re putting together a digital product, one of the questions that’s important to address is the idea of scalability. What are the short- and long-term projections for the product that should be accounted for? Having a design system in place helps to address this concept of design and development debt. As your product grows, more features are added to the original base design, and in turn, other features and design aspects become outdated and need to be replaced. Teams on the client-side contract and expand. Product/project focus may shift. Without some form of a design system in place, the original product can loose its originally intended identity, and might start looking like that scrapbook. It also can quickly become a maintenance nightmare, and you may find yourself in a place where even the simplest of front-end updates end up taking exponentially longer than you’d expect.

With a design system in place, as changes occur, be it to the product or the teams that manage the product, there’s always a baseline to return to for reference on what should be managed, changed and built upon.

We’re Already Getting You Started with Design Systems, Though You Might Not Know It 😉

That might be a surprise, but it’s true! When you work with us on creating a digital product, we’re getting you started on the right track with some form of a design system. As I mentioned before, by using Bootstrap we’re able to leverage UI libraries and components that we can custom-tailor to the product and implementation, and do so in a way that future-proofs the design for scalability, design updates, and enhancements. Our teams of designers and developers work together to write code that is maintainable and semantic, and we’re using tools like Sketch and Zeplin that work together to create style guides, component libraries, and design hierarchies.

While building out digital designs, we’re able to assign and create symbols and components that are reusable, easily updated. These also give the development teams a head start on making development decisions that will be easy to maintain and implement.

While the examples I’ve cited above don’t replace a fully built-out, documented design system, we integrate design-system thinking into our design and development process to allow these concepts to take effect, regardless the project size. It’s a great first-step for our customers to have a design-system approach that helps to minimize that design and development debt that can accumulate over time, and as well it makes use more efficient and proficient designers and developers. It’s really a win-win for us and our clients.

I believe as we venture into this new year, we’re going to continue hearing more about design-system methodology, and my hope is that you see how these processes and concepts are beneficial, and find ways to implement some of these concepts for yourself on your products and projects. As always, if you need a hand getting started, our door is always open.

13
Jan

“From the store windows, the store touchpoints, the website, social media or a magazine – it has to be one pure customer experience, not just to gain market share but to gain mind share.”

-Angela Ahrendts, CEO Burberry

The process of making a website or application is tricky, and not only in regards to design and development. Often just as challenging—and seemingly overlooked—is the process of properly identifying who you’re building for.

When we work on a client project, we’re not really working for the client. We’re working for client’s customers or audience. We’re ultimately working to ensure the experience your customer has with you is a positive one that reinforces your brand’s validity, encourages use, and ultimately shows you a return on your investment with the project.

How do you manage a seamless experience across an always changing and increasing number of content channels, though?

Honestly, you can’t.

But, what you can do is influence your users’ experience by being very intentional about where and how you deliver your brand and content, doing so in a way that is consistent across platforms. When we do this, it’s what we call “designing the experience.”

This is how we do it.

Identify Your Audience.

You may already know your audience, or you may need help determining who they are. If you do know, it can be worth it to do the research anyway. The goal is to focus the project’s direction by identifying the audience: your customers, current and/or potential.

Gaining a better understanding of your customers can be accomplished through the process of user and A/B testing, market research, and other early-stage research methods.

It’s very possible that you already have a good understanding of who your audience is, but it’s equally important to know your audience’s why and how. Why will your audience be interested in what you’re doing? How will that affect the way they view your brand? How do you keep your audience returning and engaging?

Gain Perspective.

Now that you understand your audience, you need to know who within your audience you’re designing for.

During the discovery phase of any project, it’s important to keep in mind how the design, functionality, and content will affect your customer. This often means putting aside personal preferences, putting away egos, and establishing a cohesive direction between the client and the agency. That requires clear direction and communication from the client, and a sense of trust that the agency has the (client’s) customer’s best interests in mind.

It’s the agency’s job to combine that with a clear understanding of what will work best from an industry perspective and ultimately enrich the customer’s overall experience.

Just because you want to create an app doesn’t mean that your customers are going to install and use it even once, let alone on a regular basis.

Or visit that website.

Or ingest that content, evoking the desired response.

Understanding the why behind your customer’s need (implied or apparent) will ultimately be a gauge for design decisions along the way.

Set Measurable Goals.

We see it all the time: client wants a project completed, comes to an agency. Agency creates the project, hopefully to the client’s liking. End of story… right?

Not here, at least.

It’s important, especially early on, that the client and agency sit down and set measurable goals for what they want to accomplish with their project. Hardly ever is just launching the site or application the measure of success—nor should it be. 

Setting measurable project goals does a few things.

First, it gives the client a baseline to measure a project’s success against once it’s completed.

Second, it provides a foundation upon which they could build in the future if a change in direction is required.

Third, it gives the agency a framework to work within to provide a solution.

After all, an equation can’t be solved without first having a problem, right?

Walk, Don’t Run.

This next point might seem a little blunt, but it’s important.  Because we care. Really.

Don’t be too anxious to jump right into design and production, at least initially.  

It’s pretty normal, and honestly expected, that a client will come to the table with what they feel to be a pretty solid understanding of exactly what needs to be done and created, but without taking preliminary steps of discovery and planning. The thing is, discovery and planning can make the difference for a successful project.

Even if it’s not within your project budget to account for variations of the steps listed above, it’s good to be at least open to sitting down and having an honest conversation about the project. Give your agency a chance to really make the project work for your customers. In doing so, you may find that your good idea really has the potential to be great.

In the end, we’re all on the same team, playing for the same goal: hitting a home run for your customers by providing the most seamless possible experience that enforces your brand’s integrity and messaging, leading to engagement, sales and growth.

It’s the Elexicon way.

21
May

Don’t forget the digital strategy

Posted by: Calvin Chopp

You’ve just been put in a room with 4 other people and it’s dark. Can’t-see-your-hand-in-front-of-your-face kind of dark.

Each of you have been told that there’s an item directly in front of you, and that you need to describe it.

You reach out and place your hand on what feels like a hard, leathery, textured wall. The person nearest to you describes a long, protruding spike that’s smooth and solid. Another feels a vine-like hairy rope.

Who’s right, and how can you decide what it is?

Without seeing the whole picture or knowing in advance, each person can’t communicate with the other that what they’re actually describing is a rhino.

With all its textures and types of surfaces, a rhino could be described many different ways by someone who couldn’t see the big picture. The same is true with your digital strategy. Without planning, it can feel like there’s as many ways to approach that strategy as there are dots that I had to make to create this piece!

 

On-boarding and communicating your digital strategy within your company’s team structure can often feel like trying to describe something in the dark that has many facets and attributes:

If you’re in marketing, a digital strategy likely involves your website, social media, online campaigns, and design approach.

If you’re a stakeholder, you’re likely more focused on analytics and ROI.

If you’re in IT or data networking, you’re likely focused on things like information and data processing, storage and backups, etc.

If you’re in sales you’re likely concerned with the integrity of your CRM database, making sure it’s reliable, and with conversions.

With so many ways your company’s digital strategy can be approached, it can feel overwhelming. This shows in companies even today where everything seems to be online.

The 2016 Report on the State of Digital Business found that

  • 62% of survey respondents felt their companies were in denial about the need to transform their business approach digitally,
  • 55% were worried that they would have only a year or less to make the proper steps before they would suffer both financially and competitively, and
  • 59% were worried that it was already too late to start the process of creating a digital strategy.

(Hopefully since the report’s release the companies that were surveyed have taken necessary steps.)

There’s no denying that an effective digital strategy in your business or organization is important. But how do you personally implement a digital strategy well? What’s the difference between having a digital strategy, and just creating digital products?

We’re here to help answer those questions.

For over 20 years, we’ve specialized in working alongside companies to design, establish, and successfully execute digital strategies, both internally and externally company-facing. The way that we see this played out most commonly for our clients is through a combination of website content, social media, mobile and application development, email/CRM/CMS integration, and project data analytics, among others.

Each of these are often seamlessly woven together into the client’s existing business ecosystem. This means that our clients don’t have to start from the ground up when implementing their digital strategy. We’re working alongside them to help keep their ongoing business momentum while merging a digital strategy into those processes.

It starts with a conversation.

Your needs aren’t your competitor’s needs. Your business is uniquely your own, and your digital strategy shouldn’t be a cookie-cutter, one-size-fits-all approach.

The backbone between us and our clients is always our relationship, and part of establishing that relationship is working with the client to determine their unique needs, and how our team of experts can come alongside their existing internal teams to aid in the implementation of their digital strategy, or work with them to open up this channel of content where they might not be capable to do so on their own. We explore what our clients are doing digitally currently that they feel is effective, what their goals are, and areas that they’re feeling pressure to evolve their approach. Based on this information, we’re able to communicate a solution that works for our clients, as well as offer recommendations to approaches they might also look to consider.

It’s more than just a product.

As I mentioned, your digital strategy is more than just a product. Your website isn’t your digital strategy. Your CRM database and promotional email schedule isn’t your digital strategy. Your social media channels and content aren’t your digital strategy. These are all pieces of a greater mechanism that we like to look at with you and create a way that all these tools (and more) can work  seamlessly together—making you more noticeable, your online business more effective and measurable, and your future digital initiatives more scalable.

Analyzing your effectiveness.

Although the concept isn’t new, a major buzzword over the last half-decade has been ‘UX’ or ‘user experience’. Its implementation on the digital landscape in your company ultimately comes down to your ‘digital equation’ — adopting data analytics and metrics to build up your analytical thinking which will help drive your digital business decisions.

We see this play out a number of ways. We can help you implement tools and show you how you can analyze data and insights for your current online systems, or for new products, which help you deliver better, more responsive services to your customers. Through user research, A/B testing, persona research, and user feedback, we can fine-tune your website, software, and applications to better suit the user, quicker and more effectively than ever before. We set up our digital products in a way that allows us to build, execute, analyze, and optimize as we go.

Digital Strategy at Work.

For your consideration, a recent example of digital strategy at work in a project completed for one of our clients.

Two years ago we were tasked to work alongside the Amway Global team to develop a digital experience for their media guide that, to that point, lived solely in a print publication. The desire was to have a single, long-scroll page that would keep the user’s attention, divide the content up into digestible, navigable chunks of content, and that was high-design and interactive. The client also desired to have data they could analyze to see what information was being consumed and where users were gravitating to on the page.

We worked with Amway to not only meet these expectations, but to throw in some additional features along the way.

 

 

The digital solution we crafted was a long-scroll page that was managed by a content management system where the team could easily edit the content of the page, move content around the page, and manage multiple levels of in-page navigation to access that content in an experience that was immersive and effective. The client had the ability to track what sections of the page were being clicked on and which products were most popular. This all wrapped into a single, 30,000+ pixel long, mobile-optimized page.

The foundational strategy of the page also was that we wanted the solution to be scalable and manageable. Because of the pre-planning and work that went into this strategy, the next year we were able to update the content and look and feel of the page at a fraction of the cost that it would of taken to start over, or go a different direction. What originally took months to design and develop in 2017 took a matter of days to update with a fresh look and content for 2018.

Regardless of your company or organization’s size, you can’t afford to be unfocused in your digital strategy. Tackling it on your own can be a daunting task, and this can cause you to fall behind your competition and to put you into a cycle of feeling the need to always be catching up. We’re ready to partner alongside you to build your digital strategy. Whether you need a team of professionals to hit the ground running on something new, or need someone to work alongside your internal team to help see your initiatives through effective completion, we’ve got your back.

05
Dec

Review: The Wacom Cintiq Pro24

Posted by: Calvin Chopp

As a designer, I’m always looking for ways to improve my workflow by practicing my craft, honing in my skills, and looking for tools—both software and hardware—that might make me a better, more proficient designer.

Years ago, I began using a graphics tablet to aid in my design process for digital illustration, photo editing, graphics creation, etc. Almost immediately I saw the benefits of using a tablet over relying  solely on my mouse to navigate my designs. The pen provided a much more natural editing experience than clicking around with a mouse, and made the analog illustrator in me happy. Beyond that, the literally thousands of pressure sensitivity levels through the pen on the tablet give so much control with photo editing, illustration, and design work compared to the single pressure level of a mouse. I now encourage any budding designer to invest in an at least an entry-level graphics tablet to help improve their design workflow. It only makes sense.

Years after purchasing my first Wacom Bamboo tablet, I wanted to upgrade my available design real estate, which brought me to the Wacom Intuos Pro Medium. The Intuos served me well for 5 years, yet my ultimate goal was to invest into a tablet that offered the flexibility of designing directly on the device. After much research, I eventually purchased the Wacom’s Cintiq Pro24.

The CintiqPro is one of Wacom’s flagship design tablets. This particular model and its siblings the Cintiq Pro 13 and 16 were released earlier this year, with the 32″ model being released a little over a month ago.

The Pro24 has a 24″ 4K  screen with superb color accuracy—able to display 99% Adobe® RGB. I won’t get into all the specifics on the hardware, but if you’re interested, you can find details here.

Set Up

Wacom’s long been the target of complaints from people having issues with their drivers and installation on their products. For my part, I’ve never had issues with installation for any of their products.

The CintiqPro comes with essentially every cable you’d need depending on the computer configuration that you’re running.  I’m working on a late-2014 Macbook Pro, so my connectivity setup includes a DisplayPort cable with DisplayPort-to-Thunderbolt 2 adapter (both supplied by Wacom), as well as a USB cable for all functionality of the tablet to work properly.

The cables tuck in nicely to the back of the hardware, making cable management a bit easier,while allowing for different angles to adjust the display for working comfort. If you find yourself with $3,000+ burning your pocket, Wacom also makes a product called their ProEngine that fits nicely into the backside of the display where the cables plug in. This essentially turns your design tablet into a workhorse computer—no longer requiring an external computer to power it. If you want to pretend you’re going to buy that and see some specs, check those out here.

I will say that on my computer, those inputs get quite crowded. Fortunately, I would rarely use both of my external monitors alongside the tablet for my work. Still, I will be investing in a new DisplayPort-to-Thunderbolt cable soon, so it won’t be quite as crowded. For those running computers compatible with USB—C, such as the newest Macs outfitted with Thunderbolt 3, this wouldn’t be an issue.

Calibration of the pen and display was also a breeze, and took mere minutes to run through. Within 15 minutes of getting the product out of the box, I was up and running and ready to design.

First impressions

Yeah, this thing is big. If you’re going to invest into a graphics tablet this size, make sure you have sufficient desk space to accommodate it. The tablet itself weighs nearly 16lbs, so it might not be super comfortable to use in your lap, but I also would argue that’s not the intended purpose of this device. I’m honestly thrilled with how much real estate there is to work on here, and the 4K resolution is great, so the tradeoff between portability and real estate is favorable.

The surface of the tablet itself is great to design on. The top of the tablet is completely flat etched glass which gives a very natural feeling for the pen. Because the surface is devoid of bevels, it’s also  incredibly comfortable to lay your arm on, and you can travel the full surface of the display without interrupting your pen stroke.

Wacom also has a model of the Cintiq Pro24 that supports touch functionality. After much research, I opted out of that $500 upgrade, as many designers and artists I read about complained of glitchy performance, which often resulted in them just turning off the touch functionality while designing with it. With the ExpressKey Remote functionality (covered below), I’m able to cover basically all the bases I need if I really want the ‘convenience’ of touch functionality (minus the glitchiness and added $500 pricetag).

The CintiqPro also comes with Wacom’s new Pro Pen 2.

The pen itself is a bit narrower than its predecessors and is very comfortable in the hand. The pen has virtually no lag or parallax on the display, supports tilting or shifting of the nib for different design effects, and doesn’t require a battery at all.

The pen touts 8,192 levels of pressure sensitivity, compared to Microsoft’s Surface Pen at 4,096 levels of sensitivity (and added requirement of a battery) or other smart pens like the Apple Pencil. The Wacom Pro Pen and other Wacom hardware are engineered and built specifically for design professions, and their product orientation reflects that. So I’d argue that the comparison isn’t direct, though Apple, Microsoft and others also provide good alternatives. I’ve read plenty of articles that compare and contrast Wacom products to those produced by Apple or Microsoft, but it’s a little ‘apples-t0-oranges.’

Because of the edge-to-edge screen, Wacom has obviously removed any physical buttons from the surface. The power button is along the top edge of the tablet, and the side edges have inputs for USB and MicroSD card slots. And there are a number of  under-glass buttons that allow you to access system and display settings along the top right edge of the display when under power. All of the actual hotkeys and controls from past tablet models now live in Wacom’s ExpressKey™ Remote. The remote itself is included with the Cintiq Pro24, but can be purchased separately from Wacom for a little over $100 and is compatible with other Wacom products.

This thing is awesome.

The keys are fully programmable and allow you to toggle between commands. Because the remote isn’t connected to your tablet, you’re able to position the keys where it’s comfortable for you. This is especially great for right or left-handed designer’s preferences. The remote itself also has a magnetized base so it stays in place on the device if you have it resting on the side. Wacom provides a charger for the remote, which plugs directly into the tablet, and allows you to use the remote while charging as well.

Final Thoughts

OK, I won’t say these will be technically my final thoughts since I’ve only been able to use this for less than a week, and I’m  planning to do a follow up after I’ve been able to use it for a greater length of time. What I will say is that the design experience on this thing is incredible. For me, integrating a graphics tablet into my design workflow was a game changer years ago, and investing in the CintiqPro 24 is just another huge step in that process. I’ve already seen it help aid in the accuracy and speed that I’m able to edit photos, illustrate, and produce designs.I can’t wait to find additional opportunities to continue using it to further develop my skill set and offerings to our clients.

Product Pros & Cons

It’s a product review. Can’t have one without a pro/con list, so here you go.

PROS

  • A beautiful 4K display.
  • A large, completely flat design surface to work on
  • The build-quality and apparent durability of the device.
  • The ExpressKey Remote is super convenient and is very easy to configure.
  • The battery-free Pro Pen 2 with 8,000+ levels of pressure sensitivity.
  • An adjustable base for design-angle flexibility.
  • Out-of-the-box connectivity options from Wacom make set up easy.

CONS

  • At just over $2,000.00 for the non-touch model, it’s pricey.
  • The large size won’t be for everyone. It’s not a tablet you’re going to take to the coffee house with you to work on.
  • The DisplayPort-to-Thunderbolt 2 converter is a bit bulky (but I am thankful it was provided).
  • The cables in general are long. Not a huge deal, and it does allow you to move the tablet around quite a bit, but cables all over my desk drive me nuts.

 

Here’s a quick sketch I did the night I set up the tablet, which was the same night of Stan Lee’s passing. I’m forever grateful to him for his creativity and the universes he crafted. He was an inspiring individual to me who was part of the driving force that encouraged me to pursue a career in art and design.

11
Jan

Making Photoshop Work Better for You

Posted by: Calvin Chopp

ps-tutorial-feature

 

I’ve been a heavy Photoshop user for over 15 years, using it for anything from general graphic design and photo editing to web layouts and UI to digital illustrations and concept art for video games. To say the least, it’s versatile and has been around seemingly forever, at least in my lifetime.

Using Photoshop as long as I have means I’ve gotten used to how things work, and when those things change, sometimes it feels disruptive. I’m going to discuss two of these recently updated features here, and tell you how you can revert them back to how it originally worked if you so choose.

FEATURE 1: New Document Workspace

 

workspace

Let me start off by saying that if you’re new to Photoshop, I can see how this particular update that was recently made in CC 2017 might be useful to you. There’s a huge variety of templates to choose from now—anything from photo templates, to mobile, film and more. It also gives you the option to use a recent size item you’d created. But, for a more seasoned Photoshop user, using the software for a particular purpose, it’s a bit much. Here’s why it was for me:

  • Additional load time. Granted, it’s not significant, and likely varies from machine to machine (I’m running a Mid-2014 Macbook Pro, w/ a Solid State hard drive, 16GB of RAM and an i7 Processor), but the time it takes from launching Photoshop to getting to the New Document Workspace adds nearly 2 seconds of wait time for me. That may not sound like much, but as someone who spends a huge portion of their work day in the software opening, closing, and creating many Photoshop documents each day, it is noticeable, and gets annoying.
  • Too many upfront features.  So many options! Too many, I feel upfront, at least for me, which I think adds to that additional upfront loading time. Packing in so many features makes it a little confusing with the way the new document inputs are laid out. If you’re tabbing through each input field (i.e. width, height, resolution, etc), in the legacy New Document workspace, you went from top to bottom, like a standard input form. In the new input form, you jump from top, down, to the right, then left to right, and down again. It seems unnecessarily confusing.

Thankfully, PS CC 2017 allows you to set your New Document workspace back to the legacy version if you’d prefer—here’s how:

Reverting Photoshop’s New Document Workspace:

First, you need to get to Photoshop Preferences. On a PC, go up to the Edit menu in the Menu Bar along the top of the screen. Choose Preferences, and then choose General. On a Mac, go to the Photoshop CC menu, choose Preferences, then choose General. This can also be reached by hitting the shortcut Command + K.

edit-workspace1

 

This opens the General Preferences dialog box. Within this, look for the option that says “Use Legacy “New Document” Interface, and click this option.

 

edit-workspace2

 

You’ll need to quit and relaunch Photoshop for the change to take effect.

FEATURE 2: Last Filter Shortcut

Doing web design, and UI layout and design often means repeating a similar style or filter to multiple elements. In the past, on a Mac, this was easily done by applying the most recent filter to multiple layers quickly by hitting Command + F. But in the latest iteration of CC 2017, they’ve replaced this long-standing keyboard shortcut from Command + F, to Control + Command + F, and giving the existing Command + F keyboard shortcut command to a new feature, the extended Photoshop Search functionality.  

Like the New Document screen, it’s ultimately not a big deal, but I’d argue that it’s not good user experience to introduce a new feature, and replace an existing keyboard shortcut that users are accustomed to.

If you too find this annoying, you can reset your keyboard shortcut command to repeat a filter like it had before:

  • Open Photoshop and navigate to your Keyboard Shortcuts. You can do so by doing one of the following:
    1. Choose Edit > Keyboard Shortcuts 

      edit-workspace3 

    2. Choose Window > Workspace > Keyboard Shortcuts & Menus and click the Keyboard Shortcuts tab. 

      edit-workspace4

 

One you have arrived at Keyboard Shortcuts,

  1. Click on the Filter option from the list of available current keyboard shortcuts, and select Last Filter 

    edit-workspace5 

  2. Click into the shortcut area that currently reads Control + Command + F, and add your desired keyboard shortcut. NOTE: you add the new desired shortcut by actually performing the shortcut, in this case, hitting the keys Command + F, as opposed to spelling it out within the input field.
  3. You’ll get a warning noting that by adding this keyboard command you’ll be overriding the Edit > Search functionality, which is what we wanted to do along along.
  4. Click OK

Overall, I’ve been pretty happy with the most updates that I’ve experienced in Photoshop over the years, with the exception of some rather minor annoyances such as these. Hopefully these tricks benefit other Photoshop users experiencing similar frustrations.

Back to Top