If you're a UI/UX designer or perhaps a web designer, then you might probably know about Figma and what all it has in store for you. But did you know you can now make your task easier with some easy Figma tips and tricks? Well, without building any more suspense, let's hop onto some of my favorite Figma tips and tricks that I can't live without.

Figma Tips And Tricks To Make Your Work Easier

Update or add the new auto-layout feature for dynamic resizing of your designs. With the auto layout, you can quickly create buttons, lists, models, etc., with multiple margins and resizing rules that can easily accommodate more intricate components and eradicate the need for tedious spacing edits.

Update auto layout

Using a base unit of 8px is often recommended for multiple reasons and must be used consistently for every sizing and spacing task. You can make this more straightforward for yourself and your entire team by simply setting the "nudge amount" in Figma from 10px to 8px. This way, every time you will move or resize an object, it will be in increments of 8. To use the nudge, hold down the Shift + arrow key, and to adjust the nudge amount, navigate to Menu > Preferences > Nudge amount > 8.

Update the nudge amount to 8px

I had no idea about the Bar Graph arc tool until I read about that tool on the FIGMA blog and tried. It makes a minimalist Bar Graph arc and saves time to create arcs like how we did in the old days.

Use the bar graph arc tool

You can use the base components more efficiently by creating and managing components with multiple variants. Each variant will hold its individual nested base component overwritten to create a novel state. This makes bulk updates pretty easy and also ensures 100% consistency.

Manage base components

Use "true/false" or "on/off" labels to switch between two distinct properties. This little trick will make switching variants quicker and closely match how different components work in the code. For instance : Type=Single-line, State=Default, Optional=Yes

Use true/false logic

After selecting multiple objects in the table, click the grid icon in the corner to organize your design. This equalizes all distances between objects, allowing you to drag and rearrange objects and adjust their spacing.

Organize the grid or swap position

Aligning various objects and adjusting the spacing just right can seem pretty tedious and time-consuming. However, fortunately, Figma's "Smart selection" & "tidy" features enable you to do just that in bulk.  With Figma, similar objects can be auto-arranged into a neat list or grid, bulk spaced, and reordered. <ul><li>To bulk edit spacing, select similar objects > select list/grid icon > drag spacing right, left, up, or down. </li><li>And to swap the object placement, select similar objects > select the dot inside a single object > drag and drop it into a new location. </li> </ul>

Edit spacing in bulk

It's essential to keep your file organized with a defined naming structure and hierarchy for all your layers. This task is made much quicker with Figma's "Rename Layers" model, enabling you to rename layers in bulk. You can rename each layer to be the same, have a number suffix, add a prefix to distinct names, or rename only part of the layer's name. To access the Rename Layers model, navigate to Right-click layers > choose "Rename."

Rename multiple layers at once

Let's face it, having to look for a specific design or master component can sometimes be pretty time-consuming and may also lead to miscommunications and duplicacy. Therefore, organize your file pages to make navigating and maintaining them quick and easy. Make sure each page has a well-defined name for various design and documentation purposes.

Organize your file pages

It's no mystery that using keyboard shortcuts is much quicker than using the mouse. Practically every action can simply be initiated with a keyboard shortcut to make working in Figma seem much faster and efficient.  Besides, is there anything worse than seeing a designer struggle with their mouse while they can simply use the shortcut key? Therefore, challenge yourself to learn a new shortcut every day! To view keyboard shortcuts: Hit"?" in the bottom right corner of your browser.

Use keyboard shortcuts

To keep your design pixel perfect with the help of a scale tool, simply select all the objects that you want to scale, then hold K on your keyboard and drag. Earlier I was so reluctant to scale the whole artwork because something always broke, especially the text field, and I'd have to re-adjust the artwork. But now, with the help of the Scale tool, those headaches are no more. All your artwork scales perfectly and maintains the propositions, and you no need to re-work on the artwork.

Use the scale tool

CMD (CTRL) + / has many practical quick applications that can save you a lot of time in your workflow. If you are not using it, it is strongly recommended that you check what is available on the menu. Unlock all items and change the font.

CMD (CTRL) + to unlock the lock objects

<ul><li>Drag the selection box and then hold down the spacebar to increase the size of the cursor selection. If you're drawing a shape, you can also reserve space to move the object as you draw. If that's not enough, press the spacebar, and Figma will automatically move the object into an auto frame or layout. You can also substitute it for nesting. The space bar is very handy!!</li><li>Hold down the spacebar and move the object out of the frame to make it stay inside the container. You can also disable movie clip content in the object container so that it can be seen even when it is outside the container. </li></ul>

More time saving tricks with spacebar

As good as Figma is, these Figma tips and tricks are pretty impressive and valuable for work, making your tasks easier, as well as faster.


product

Product & Design

13 best Figma tips and tricks for designers in 2022

Using the term User Experience (UX) and User Interface (UI) interchangeably is a common mistake. However, it’s important to distinguish the two. It might be a surprise to some but UI is actually a part of UX. Basically, User Experience design focuses on functionality, usability, simplicity and clarity of the product/service. In short, if users are able to solve a particular problem within the design and how easy/hard it is. User Interface, on the other hand, is about the visual experience of the product/service. It focuses on the look and feel of the product/service.

1. UX and UI are not alike

Designers, entrepreneurs and innovators often assume that the potential users of their product are like them. That’s a big mistake. The psychological term for this tendency is a false-consensus effect. Basically, people assume that others share the same beliefs and will behave similarly in a given context as they do. Avoid that, many others have done that before you and it didn’t end up well for them. Whatever product you are making there is a high chance that the future users are typically not like yourself. Most probably, they have different backgrounds, mindsets or goals.

2. You are not the target audience

The wheels need to keep turning and you have a deadline to meet. This is a common justification for why UX is not prioritized. It’s also a common way of spotting whether your organisation has understood what UX really is. User Experience design is not a process that your team has to adhere to, it’s a mindset. You should always keep a superior user experience in mind when you are designing and developing your product. Therefore, it is advisable to consult an experienced <a href="https://clay.global/">UI/UX design agency </a>.

3. UX should be a mindset, not a step in the procedure

You remember the time you dropped a joke and nobody got it, so you had to explain it? Yeah, it wasn’t that funny after all. Same goes for UI, if you have to explain the design and the reasons why you made the choices that led to that design, then it’s not good enough.

4. UI is like a joke – if you have to explain it, it’s not good enough

Well, that’s just partially true. The idea that every distant corner of your product should be reachable within a few clicks is just plain wrong. Not all the information possible needs to be the first thing the users see. A great example is the “about company” button. For those interested in the history behind the company, they can dive into that and dig around. In a world where humans are scoring a record low on the attention span chart, you need to put all your focus into what brings value to your users, the vital information.

5. All pages need to be accessible with a maximum of 3 clicks

Speaking of attention spans, you need to be crisp when serving your users, don’t overwhelm them with information. An attention span is defined as the amount of time someone concentrates on a task without becoming distracted. In 2015 Microsoft conducted a study that revealed that the average human attention span has declined from <a href="http://time.com/3858309/attention-spans-goldfish/">12 seconds to 8 seconds </a>. That’s some scary stuff, we basically have a shorter attention span than a goldfish. Yes, a freaking goldfish. So when you are designing your product, ask yourself this: “Would a goldfish be able to use this?” If not, back to the board.

6. Adjust design for short attention spans

We love this one. Especially founders, CEOs and chairmen have built careers by having strong opinions about virtually anything. By having strong opinions, most of which were correct, otherwise, they wouldn’t be able to enjoy their level of success. This fact builds ego. But when it comes to creating an awesome experience for your users, ego has no place in that process. So before you walk into a work session or an individual testing session together with your colleagues, leave your ego at the door. That’s a very useful inspirational quote.

7. Leave your ego at the door

Don’t use Lorem Ipsum and dummy placeholders all over the place when you demo a new design. It is hard to come by a product that is not based around original content, whether that’s text, images, or videos. It’s not far off to say that design is an enhancement to the content. Yet many make the mistake of putting <a href="https://www.makeuseof.com/tag/lorem-ipsum-case-wondering/">Lorem Ipsum </a>all over their design, not taking content into account during the design phase.

8. Use real content when designing

Simplicity is the king and consistency is the queen. In the context of digital products, simplicity means that’s it’s easy to understand and interact with your product. Your users shouldn’t need to read instructions to understand how to use the app or have a sitemap to be able to navigate through it. It’s part of your job to make things clear and subtly guide them from where they are to where they need to go.

9. KISS – Keeping It Simple, Stupid

Prototyping allows you to test your hypothesis before spending time with an engineering or development team building the actual product. Designers can use different design techniques for it. One useful technique is called rapid prototyping. It’s a popular way of quickly creating the future state of a product, be it a website or an app, and validating it with a group of users.

10. Prototype

Before designing a website or an app, what are the 10 top things you need to know? Hint, UX and UI design is one of them.

10 Things You Need to Know About UX and UI design - Wiredelta

Technical issues are the number one reason why apps get deleted, so make sure you understand customer experience (CX) through all phases of the product life cycle. CX is the sum of the user’s interaction with the app or product, starting at the consideration stage and moving through support, upgrades, and eventual replacement or removal from use. Think about the interactions with your customer during each of these phases—before, during, and after they use your products.

1. It’s not just about UX. It’s also about customer experience

As a developer you might be lucky enough to meet real-life users, but often you can’t stay in constant touch with them. On top of that, you probably have your own biases and opinions about usability, and with travel and budget constraints, developers sometimes query people who are in close proximity to them but aren't representative of the wider user population.[…] Once you receive feedback, be sure to follow up on it in a timely fashion and apply it to your product.

2. Validate your assumptions with actual users

This is a key part of UX, and in my experience, nothing other than perfect will do. As Todd DeCapua says in "Why performance engineering is essential to business success," if your page takes more than two seconds to load, people are likely to assume that it has issues and walk away. So it’s important to test performance and latency under real-world conditions, using 3G, 4G, and Wi-Fi, and then test while moving between these networks.

3. Performance is just as important as functionality and design

Help users orient themselves, and make it easy to go forward and backward easily within your app—not just when scrolling but also after page refreshes. Users should know where they are in the application at any given time, regardless of the actions they’ve taken.

4. Use clear and simple navigation

A door doesn’t have a sign saying “Open me." People know that's what a door is for. What they want to know is where it leads. The better approach is to explain what a link does and where it will take them.

5. Avoid “click here” links

Double scrolling occurs when you have two scrolls in the same direction, with one of them in a frame, or when you have a combination of horizontal and vertical scrolls. This is extremely confusing for users and often leads to errors. It also makes it nearly impossible to use the app on a device with a touch/swipe user interface.

6. A double-scroll is poor UX

Skeuomorphism, the design practice of making items resemble their real-world counterparts, is your friend, but you should only take it so far. Having a disk icon for saving or a printer icon for printing is intuitive, but don’t invent new concepts or representations. Limit yourself to reusing well known visual concepts.

7. Use clear, recognizable, and consistent icons

Users access most pages from mobile as well as tablets, laptops, and desktop computers, so your pages should look good and be easy to use on any platform and at any resolution your users might require. Make sure fonts as well as graphics are part of your responsive design, and be sure that you honor any accessibility settings that the user has configured.

8. Align fonts for mobile

Errors happen, but if messages are not clearly visible and informative, they're just an annoyance. […]Looking at both the strategic and tactical levels where you can affect user experience, engagement, and satisfaction will help you avoid some mistakes and create a truly differentiated product.

9. Show informative error messages

Here are the top strategic and practical user experience (UX) tips and best practices to help developers give their apps a competitive advantage.

computerscience

Computer Science

9 UX tips and strategies for software developers

UX design is crucial to just about everything. It renders the latest technology accessible to the masses, makes our favourite apps and websites a pleasure to use, and determines which brands and products we return to over and over again. To put it simply, design matters. UX designers can make a huge difference to the world in which we live — not only through designing great user experiences, but by spreading the word about the immense value of good design. So what is UX design all about? Let our all-time favourite UX design quotes enlighten and inspire you!

Inspirational UX Design Quotes That Every Designer Should Read

— Frank Chimero, Designer Good UX design is all about putting the user first. Any aspect of a website, app or software that doesn’t consider the user’s needs is ultimately doomed to fail. A huge part of the UX design process is getting to know your target audience: what are their goals? What are their challenges? What motivates them, and how do they move? The entire product should be built for these people, so don’t even think about opening Sketch until you’ve done your user research. You can learn <a href="https://careerfoundry.com//en/blog/ux-design/how-to-conduct-user-experience-research-like-a-professional/">how to conduct user experience research like a professional here </a>.

1. “People ignore design that ignores people.”

— Billy Gregory, Senior Accessibility Engineer This tweet from Billy Gregory, Senior Accessibility Engineer at <a href="https://www.paciellogroup.com/">The Paciello Group </a>, serves as a stark reminder that <a href="http://www.brandquarterly.com/importance-inclusive-design-ever-digitalised-world">UX design must strive to be as inclusive as possible </a>. It’s essential to design not just for the average user, but for all users. This means considering users with visual impairments, for example, as well as taking situational impairments — such as background noise — into account. Good UX is all about making technology user-friendly and accessible, after all, and this must include every segment of the population.

2. “When UX doesn’t consider ALL users, shouldn’t it be known as “SOME User Experience” or… SUX?”

— Blake Ross, Co-creator of Mozilla FirefoxA product is only ever as good as its UX. You can have the most innovative technology, but if it isn’t user-friendly, it will struggle to reach mainstream adoption. Products like the iPod and the iPhone would never have become so popular based on the technology alone; what really sealed the deal is the fact that they have great UX.

3. “The next big thing is the one that makes the last big thing usable.”

— Scott Belsky, Chief Product Officer Simplicity is everything when it comes to great UX. As Albert Einstein famously said, “Any darn fool can make something complex; it takes a genius to make something simple.” The user experience of any product should be as straightforward as possible; as soon as the user lands on a website or opens an app, they should be able to navigate from A to B without even thinking about it. Great UX design is about simplifying the user journey — and this means getting rid of all and any elements that aren’t absolutely necessary.

4. “Rule of thumb for UX: More options, more problems.”

— Brenda Laurel, PhD, Independent Scholar Design isn’t just about aesthetics. It’s the art of making things usable — be it an app, a gadget or a simple everyday object like a chair. UX design is nothing without human interaction, and if a product isn’t fully able to serve its purpose, the design process is incomplete. This is why user research and usability testing are so crucial, and as a UX designer, you need to be prepared to iterate and reiterate your designs over and over again.

5. “Design isn’t finished until somebody is using it.”

— Fred Beecher, Director of UX, The Nerdery Here, Fred Beecher pretty much sums up UX design in a nutshell. It’s a common challenge that UX designers face: explaining to others exactly what they do, and attempting to convey just how crucial UX is to just about everything! This quote also reiterates that people are at the heart of UX design, and without that human factor, technology remains largely inaccessible. You can find a more in-depth explanation of <a href="https://careerfoundry.com/en/blog/ux-design/what-does-a-ux-designer-actually-do/">what a UX designer actually does </a>here.

6. “How do I explain what I do at a party? The short version is that I say I humanize technology.”

— Dain Miller, Web Developer UX and UI are inextricably linked, but they are <a href="https://careerfoundry.com/en/blog/ux-design/the-difference-between-ux-and-ui-design-a-laymans-guide/">two very separate roles </a>— and Dain Miller describes their relationship perfectly. UI is all about the touchpoints the user encounters to navigate from A to B, such as buttons, scrollbars and swipeable screens. All of these components have a huge impact on the overall UX of a product, and you can’t have one without the other.

7. “UI is the saddle, the stirrups, & the reins. UX is the feeling you get being able to ride the horse.”

— Samadara Ginige, Designer and Developer As a designer, it’s important to think beyond apps and websites. Even if you’re working primarily in the digital space, remember that you’re literally surrounded by design. From architecture to fashion, right down to the simplest everyday objects like a hairbrush or toothbrush, virtually everything has been designed for human use. Design really is everywhere, so take inspiration from your surroundings.

8. “Design is everywhere. From the dress you’re wearing to the smartphone you’re holding, it’s design.”

— Robert L. Peters, Graphic Designer Robert L. Peters highlights a very important point here: design is so much more than just making things pretty. UX design influences the way we use technology, which in turn has a huge impact on our day-to-day lives. In a business setting, design shapes the entire brand and even the company culture. UX designers have a real opportunity to make a difference, and that’s part of what makes it such an interesting career choice.

9. “Design creates culture. Culture shapes values. Values determine the future.”

— Dr. Ralf Speth, Chief Executive Officer, Jaguar Land Rover Something that more and more companies are realizing: good design is great for the bottom line. According to the <a href="https://fortune.com/2017/08/31/the-design-value-index-shows-what-design-thinking-is-worth/">Design Value Index </a>, design-driven companies can outperform their competitors by as much as 228%. What’s more, in a <a href="https://www.elf.agency/news/2017/4/23/design-driven-companies-outperform-the-sp-by-219-over-10-years">study </a>carried out by the Design Management Institute, design-led companies reported 50% more loyal customers. With such statistics available, businesses can no longer ignore the value of design.

10. “If you think good design is expensive, you should look at the cost of bad design.”

— John Maeda, Designer and Technologist Design is the glue that holds everything together, and much like baking a cake, good UX relies on a combination of ingredients. What does this mean in real-world terms? Design needs to be present from day one of a project; it can’t be merely an afterthought. As we’ve already seen, design-led thinking is a huge business advantage, so it needs to be applied at strategic level — not just viewed as mere decoration.

11. “Design used to be the seasoning you’d sprinkle on for taste; now it’s the flour you need at the start of the recipe.”

— Jennifer Morla, Creative DirectorThings don’t always go to plan, and you may end up taking a design detour. The design process lends itself to creativity and experimentation, so it’s normal to stumble upon different ideas that hadn’t come up originally. As long as you remain devoted to the user and the business goals, there’s absolutely nothing wrong with veering off track.

12. “Accidents often produce the best solutions…Only you can recognize the difference between an accident and your original intent.”

— Alan Cooper, Software Designer and Programmer It’s easy to get stuck in a design bubble and lose sight of who you are designing for. Throughout the process, remember to take a moment to step back and review your progress compared to the <a href="https://careerfoundry.com/en/magazine/how-i-went-from-software-engineer-to-ux-designer/">user goals </a>. Ask yourself if what you’ve designed so far does indeed behave like a likeable person. Is it respectful of the user’s objectives? Is it generous and helpful in guiding them through their journey?

13. “If we want users to like our software, we should design it to behave like a likeable person: respectful, generous and helpful.”

— Lorinda Mamo, Designer / Creative DirectorCreating great user experiences is all about telling a story and bringing things to life. Building a detailed narrative around your user helps you to walk in their shoes and understand where they’re coming from. As Justin Daab explains , stories document emotional expectations at each stage of the user journey, help to create a visual roadmap, and finally, help to expose plot holes (i.e. potential design flaws).

14. “Every great design begins with an even better story.”

— Albert Einstein, Theoretical Physicist This final quote from Albert Einstein reflects a crucial part of the UX design process: framing the problem. As a UX designer, your ultimate mission is to solve a specific user problem, and this starts with defining a clear and actionable problem statement. Until you <a href="https://careerfoundry.com/en/blog/ux-design/empathy-and-ux-design/">empathize with your users </a>, it will be very hard to come up with a solution, so make like Einstein and give this problem-framing stage the time it deserves.

15. “If I had an hour to solve a problem and my life depended on the solution, I would spend the first 55 minutes determining the proper question to ask, for once I know the proper question, I could solve the problem in less than five minutes.”

Looking for some inspiration from design masters? Here are 15 inspirational design quotes for new, aspiring, or seasoned UX designers.

15 Inspirational UX Design Quotes 

When you invoke time in the mes- sage, you make more of a personal connection than when you invoce money. The researchers concluded that people are more willing to buy, spend more money, and like their purchases better if there’s a personal connection.In most cases, that personal connection is triggered by references to time instead of money. The idea is that mentioning time highlights your experience with the product, and this thinking about the experience makes the personal connection.

People value time more than money

We design to elicit responses from people. We want them to buy something, read more, or take action of some kind. Designing without understanding what makes people act the way they do is like exploring a new city without a map: results will be haphazard, confusing, and inefficient. This book combines real science and research with practical examples to deliver a guide every designer needs. With it you’ll be able to design more intuitive and engaging work for print, websites, applications, and products that matches the way people think, work, and play. Learn to increase the effectiveness, conversion rates, and usability of your own design projects by finding the answers to questions such as: What grabs and holds attention on a page or screen? What makes memories stick? What is more important, peripheral or central vision? How can you predict the types of errors that people will make? What is the limit to someone’s social circle? How do you motivate people to continue on to (the next step? What line length for text is best? Are some fonts better than others? These are just a few of the questions that the book answers in its deep-dive exploration of what makes people tick.

books

Books

We design to elicit responses from people. We want them to buy something, read more, or take action of some kind. Designing without understanding what makes people act the way they do is like exploring a new city without a map: results will be haphazard, confusing, and inefficient. This book combines real science and research with practical examples to deliver a guide every designer needs. With it you’ll be able to design more intuitive and engaging work for print, websites, applications, and products that matches the way people think, work, and play. Learn to increase the effectiveness, conversion rates, and usability of your own design projects by finding the answers to questions such as: <ul> <li>What grabs and holds attention on a page or screen? </li> </ul> <ul> <li>What makes memories stick? </li> </ul> <ul> <li>What is more important, peripheral or central vision? </li> </ul> <ul> <li>How can you predict the types of errors that people will make?</li> </ul> <ul> <li>What is the limit to someone’s social circle?</li> </ul> <ul> <li>How do you motivate people to continue on to (the next step? </li> </ul> <ul> <li>What line length for text is best?</li> </ul> <ul> <li>Are some fonts better than others? </li> </ul>These are just a few of the questions that the book answers in its deep-dive exploration of what makes people tick.

13 best Figma tips and tricks for designers in 2022

10 Things You Need to Know About UX and UI design - Wiredelta

9 UX tips and strategies for software developers

15 Inspirational UX Design Quotes

100 Things Every Designer Needs to Know About People

Alexandra Tudorache