Internet and Businesses

The Choice of Colors in The Design

There are tools that will help you choose a colors palette in a few seconds. You can also go to any of the resources below and find inspiration for your next project.

How to choose colors?

When choosing a color palette for your design, there are some factors to keep in mind.

  • Color Theory: It is best to familiarize yourself with color theory. This will facilitate the process of selecting colors.
  • Contrast: This is one of the most important aspects of design. Almost all design tools have plugins that help you check if your design passes the color test. There are many useful tools for working with colors in the Bookmarks section
  • Color Psychology: Color psychology is a branch of science that studies colors and how different shades of color can evoke certain emotions. There’s a good Creative design blog article that talks about how colors are associated with people’s emotions.
  • Overuse of colors: As a beginner, you can choose a main color and stick to it so that you don’t get overwhelmed by choosing multiple colors.

Tools for working with colors

There are several interesting programs that can be used to generate color palettes.

Adobe Colors

Adobe Colors lets you create color themes using a color wheel. It also gives you the ability to create color sets and gradients based on an image you can upload. Adobe Colors also has digital accessibility tools.

ADOBE COLORS

Paletton

In Paletton, you first select the desired scheme: mono (mono), complementary (complementary), triadic (triadic), tetrahedral (tetradic), analog (analogous), or accented analog (accented analog). Then, when you change one color on the color wheel, the others change accordingly.

Paletton

Coolors

Coolors helps you create new color palettes, as well as choose from a variety of already provided ones.

Coolors

Sip color app

Sip is a color picker that lets you organize and share colors. This app is available for macOS and iOS.

Sip color app

Inspiration

The resources provided are very helpful when it comes to finding inspiration.

Dribbble

Dribbble has many user interface layouts with different color schemes. It also allows you to sort the designs based on the selected color.

Dribbble

Icy Colors

Muzli Colors by InVision is a great tool when it comes to inspiration. In addition, it allows you to generate color schemes. Another great thing is that it will show you user interfaces that use the selected color palette.

Icy colors

Guiding principles of design

Apple and Google talk about colors in their guidelines. These guidelines can help designers create a color theme that works best for them.

iOS guidelines

Apple provides iOS guidelines for using colors for iOS apps.

iOS design guidelines

Material Design

Material Design is an open source color system that has a lot of information about what colors to choose. They also provide a color picker to test palettes as well as contrast.

Material Design

Nix Color

Nix Color is a cool piece of hardware that brings physical colors to your app. It scans the actual color and imports it into its mobile app. While it’s not 100% accurate, it does a pretty good job. So, if you’ve ever wanted to take a specific color out of a flower or any surface, this is the tool that will do the job.

Nix Color

How to choose colors from a photo

There are many exciting options for taking colors from our surroundings and using them in our designs. With Adobe Color, you can use your photos or images to extract their colors and create a palette. Let’s go to Adobe Color and drag the image.

How to choose colors from a photo

You will notice that Adobe Color will scan the photo and suggest a color palette.

How to choose colors from a photo

If you like the suggested color palette, you can save and publish it; otherwise, you can move the color palettes and choose the color you like. In our case, we will select a couple of different colors from the photo.

choose colors from a photo

Now that we’re happy with our palette, let’s save it. Then add some tags, rename it Purple Lights DN and publish it to the Adobe Color Community if you like.

Adobe Color Community

Click on the Research tab. In the search box, type Purple Lights DN to find the color palette.

Purple Lights DN

Next, hover over the color palette and download the JPG version of the color palette. So we can load the JPEG into our Figma file to use as a reference.

Figma file

Now press F to create a new bezel for the 44mm Apple Watch. The point is to use some colors from the color palette to create the background.

44mm Apple Watch

Then press O and create a 245×245 oval. Let’s add a radial gradient to it.

245x245

Change the colors to #2D038B. As for the second color, let’s change its opacity to 10%.

#2D038B

Let’s add some effects. Select the circle and add a layer blur with Blur 93.91.

add some effects

Duplicate the oval. For the new oval, change the color to another color from the color palette. Below we have changed it to #CA267F.

#CA267F

Next, let’s place both circles inside the Apple Watch bezel, and you’ll see the effect we’ve created inside the bezel.

Apple Watch bezel

Finally, let’s place our logo in the frame. Be sure to center it vertically and horizontally.

final image

Conclusion

When it comes to choosing colors for your app, it’s best to choose colors that reflect your brand. Color scheme can play a very important role in how users perceive your brand.

Addition info

Learn the basics of UI design with movies

Films as an art form have been widespread in our society long before people started studying visual design or just design as a discipline. The first film was released in 1888 under the title Roundhay Garden Scene. It was a short silent film (2 seconds) recorded by the French inventor Louis Leprince.

Since then, the world has experienced many revolutions, wars, inventions and pandemics. Each of these events in one way or another had a special impact on the film industry, making it what we know it today.

With the development of visual communication comes visual design. Since the word “design” actually refers to solving problems, and not just creating attractive artifacts, then each problem solving technique has a set of fundamental laws / principles / theories / formulas on the basis of which this method is applied. The same goes for visual design.

During the decades of cinema as a commercial industry, as well as art studies in colleges, people began to buy tickets for shows through digital interfaces on their devices. These devices needed to be made easier to use and learn, which was a challenge in itself. To solve this problem, a new design discipline emerged, namely user interface design.

Although this is not exactly the reason that led to the birth of an entirely new field of design. But it’s one of the many ways cinema and UI design connect. Let’s jump right into the basics of UI design using our favorite movies as an example.

Balance

This is a common thing that can be found in any stable design, unless it has been deliberately broken.

Balance can be understood as the distribution of the visual weight of objects, colors, textures and space. If there is a lot of content on the screen, it should be balanced to make the design look stable.

Symmetry is one way to achieve balance in visual design. Nature loves symmetry, and so do our eyes. Symmetrically balanced elements help reduce image noise and make it look familiar.

brucemurphy

Bruce Murphy is a freelance designer and illustrator. Bruce Specializes in UI/UX, concepts, branding, identity and 2D/3D animations. He Works with companies, agencies and startups around the world.

Related Articles

istanbul escort

Leave a Reply

Your email address will not be published. Required fields are marked *