Must-know Tips to Become an Efficient UI and UX Designer

Technology over technique produces emotionless design.” – Daniel Mall

The success of an application, be it mobile or web, depends largely on its design. And that success is achieved when the user of that application is happy. And yes, of course, the client too. But more importantly, the users.

UX and UI designers are always striving to make a user’s interaction with digital platforms a seamless journey. And that by no means is a stroll in the park. But there are methods that you can exercise to make your life a little easier as a designer.

We went around and asked our design team members about how they manage to enhance efficiency while productivity remains uncompromised. Here are some tips we picked up that will definitely help improve your design practice:

Keep your design files well-arranged

While you may think that being over-organized isn’t good, being unorganized is surely worse. Especially in the case of managing project files. Our designers believe that having a proper file-system not only gives you a sense of control over your work but also prevents your creative flow from being hampered since you don’t have to spend 60 seconds to locate an urgent file.

For instance, if you’re working on project X, you need to have a parent folder in its name, and process-specific folders within that, like assets, documents, inspiration, resources, UI, UX, and so on. And each of those folders will essentially have their own sub-folders containing the steps to the respective processes.

Care about naming conventions

Proper names are the key to organizing, sharing, and keeping track of design files. Deciding naming conventions at the beginning of a project helps reduce conflicts later on. It also ensures clarity and easier access control within the team.

Develop a naming convention based on elements that are important to the project and stick to the same structure throughout. A standardized method of working decreases dependency and smoothens the workflow for all team members. Best practices include:

  • The usage of CamelCase (using alphanumeric characters in upper and lower case) for short, neat easy-to-locate file names;
  • Using leading zeros (01-ProjectName, 02-ProjectName) so that systems and software can sort, import and export files in proper order;

Use keyboard shortcuts

As a designer, it is essential for you to streamline a process so that you get more time to actually design than click around.

Memorizing keyboard shortcuts can be a bit overwhelming at first but once you embed it into your daily practice, you’ll appreciate how faster and efficient your performance gets!

Here is an awesome shortcut reference to all your design needs: https://shortcuts.design/

Use grids

A grid helps in tying the knots of various design elements together for effective alignment and consistency, with minimal effort. Hence, your designs appear not only organized but thoughtful as well.

Moreover, people interact with digital products on multiple devices, with different resolutions, causing apps and websites to evolve constantly. When a piece of design is conformed within a grid, you’ll find it easier to reuse previous specifications to create a new version of it. Also, grid makes it easier for other designers to work and collaborate on the design as they provide a plan for where to place elements. Layout grids help in aligning objects within a frame.

Create scalable UI components

Whether you’re working on an entire system or just a screen, creating UI components is a great way to speed up on tasks. For example, SketchApp’s Symbols feature lets you use and reuse a particular element across a project. It keeps a master symbol that updates other instances of the symbol when you make some changes to it.

While this function isn’t exclusive to SketchApp, it is quite useful when you’re designing an interface using components as part of the design system. You can create scalable symbols using a wide variety of elements including shapes, bitmap images, text objects, and other symbols.

Get handy with SketchApp’s Symbols: https://www.sketch.com/docs/symbols

Locate commands with SketchApp Runner (for SketchApp users)

If you are a ninja with the keyboard, this is a must-have plug-in for you! Runner offers an intuitive interface for you to get around the SketchApp quickly and efficiently. Accelerate your workflow by speeding up iterations and design procedures.

Run commands directly from your keyboard instead of hunting around the menu. Once you catch the habit, you can create and insert symbols, create and apply styles, jump anywhere, run everything, and even install plugins using Runner!

Keyboard shortcuts for Sketch: https://www.sketchappsources.com/shortcuts.html

Unit-test task flows

American-Austrian educator Peter Drucker had once said, “Quality in a service or product is not what you put into it. It is what the client or customer gets out of it.

Unit-testing involves getting a task flow (or a product feature) tested by users. It helps get a detailed understanding of a particular interaction’s usability before it ends up being used by a larger set of users.

When you have a direct insight on whether an interface is meeting the users’ expectations, think how convenient the subsequent process will be. Not to mention the amount of time that will be saved in every design exercise.

Try Pomodoro

The Pomodoro Technique is a time management method introduced by Francesco Cirillo in the late 1980s. It involves the use of a timer to break down the work phase into intervals, traditionally 25 minutes, with short breaks in between. Each interval is a ‘Pomodoro’ (Italian for ‘tomato’), inspired by the tomato-shaped kitchen timer that Cirillo used as a student.

For many of us, time is a nemesis. This technique is a good way to learn how to work with time, and not struggle against it. You can, of course, adjust the length of the intervals as per your workload, and consequently, the breaks. But it is essential to maintain uniformity. The key is to give your 100% to your work for whatever amount of time you choose, and then do anything but work when you get to your break. During your work interval, cut yourself off from all kinds of potent distractions such as your mobile phone, social media, etc. You’ll get the time to catch up as soon as you’re through a Pomodoro!

A comprehensive guide to the technique: https://francescocirillo.com/pages/pomodoro-technique

Catch up on WCAG

Web Content Accessibility Guidelines (WCAG) define ways to make web content more accessible to people with disabilities including visual, auditory, physical, speech, cognitive, language, learning, and neurological. These guidelines have been developed through the W3C process in cooperation with individuals and organizations around the world, with the goal of maintaining a global standard for web content accessibility that would meet the requirements of individuals, organizations, as well as governments.

As designers, it is essential for you to make sure your applications are usable across a large scale, including individuals with disabilities. It also helps keep legal complaints at bay. Plus, when a product reaches a wider audience, it automatically builds a more positive reputation.

Here are more details on WCAG: https://www.w3.org/TR/WCAG21/

Inculcating new habits takes time as well as patience. But when you’re motivated to improve, nothing can stop you from learning. And if you’ve got any other tricks up your sleeve, do share it in comments!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s