Best UX/UI practices
  • 10 Feb 2023
  • Dark
    Light

Best UX/UI practices

  • Dark
    Light

Article Summary

The Zenki brand and Zenkipay are available in 3 versions, color logo for white or light background, logo in light colors for black or dark backgrounds and a high contrast version (white/black and negative) for sites.


The files are in the following formats:

PNG (RGB)

With transparent backgrounds to be able to use it on clear backgrounds without the need to crop the logo.

PDF and EPS (CMYK)

Contains the file in vector format for printing uses.

SVG (RGB)

Logo in vector format for use on the web or apps.



Logo

Security Area:

It is defined as the space that must be respected around the Zenki logo and all Zenki-derived logos to allow them to "breathe" and avoid diluting their presence with other graphic elements around.


The secure Zenki and Zenkipay logo area ensures the readability and impact of the Logo by isolating it from competing visual elements such as supporting text and graphics. This zone is the minimum safety distance; The logo should have even more room to breathe.


The safe zone is measured using the letter "n" of the Zenki logo, using its height as a basis, the height determines both. For the sides, you have to turn the letter "N" horizontally. See image.



Isotype

On some special occasions the isotype can be used as a Zenki representation element, such as in profile pictures on social networks. For these cases it is required that the safety area that is built based on half of the same isotype be respected. See figure.




Minimum allowed sizes

The minimum size ensures that the impact and readability of the Zenki Logo and derivative products are not compromised when applied in various media.

Digital

For the Zenki logo it is recommended that the minimum size is not less than 150 pixels wide by 52 pixels high.

Impression

For the Zenki logo, a size of no less than 2.5 centimeters wide and 0.84 centimeters high is recommended.

Considerations for both print and digital

All Zenki products begin with the word "Zenki", (eg: Zenkipay) For the logo of these products it is recommended that it be the same size of the Zenki logo but adding the extra that results from the product.




Color palette.

The correct color application is as follows:

For isotype colors, a 2-color gradient is used.

Hexadecimal: #FA01AD to #FE9301, it is applied within the isotype from end to end with an inclination at 36° degrees (see figure). The rest of the logo uses the hexadecimal color #533B7F.


For the products, a color is used#FD5B41 which makes the separation between the Zenki logo and the product.


To see equivalences to other color modes, see figure.




Logo variations

Colors

Dark mode versions.

For those applications (digital or printed) that have dark mode, there is a version of the Zenki logo in dark version, the gradient does not change, nor does the color of the product.

High contrast

There is also a high-contrast version. The entire logo in one color. that could be used in applications where only one ink is used (in case of print)




Slogan (tagline)

Both the Zenki logo and the derivative products have their own slogan.

For the Zenki logo, "Crypto services for all" is used. For Zenkipay, "Crypto payments with trust" is used.


You can not use slogans different from these described, nor can they be translated into another language, everything must be in English.


For the Zenki logo the color must be #9A9A9A.



Secondary typography.

The font Montserrat is used as secondary typography. This typography reinforces and represents the vision of the Zenki brand, helps to give a clear and direct message. The Montserrat font is used in banners, promotional images both digital and printed.


There is a wide range of styles within the Montserrat typography, in Zenki we only use 2, Regular and Semibold.


You can download the typography directly from Google Fonts in the following link: https://fonts.google.com/specimen/Montserrat.




Using Zenkipay buttons

There are 3 types of Zenkipay payment buttons

  • Square shape
  • Shape in two lines of text
  • Version showing 6 Cryptocurrencies

These buttons in turn have 3 color variants:

  • White background with color elements
  • Gradient background with blank elements (#FA01AD to #FE9301)
  • Solid color #533B7F(purple) with white elements

Note: these 3 versions work for dark backgrounds and light backgrounds.

The version with icons of Cryptocurrencies are divided into 2 versions:

  • For clear backgrounds
  • For dark backgrounds




Misuse of the logo

The Zenki logo and products derived from it, it is forbidden to change and / or deform the logo. The following figures are examples of what not to do with the brand

  • Deformation
  • Modify the logo
  • Change of colors
  • Logo outline
  • Size smaller than allowed
  • Change of Slogan
  • Change of address
  • Low contrast
  • Transparency




Misuse of the button

  • Do not use the official typography
  • Change of colors
  • Modify the text
  • Resizing
  • Change of address
  • Change the order of elements
  • Add items 




Was this article helpful?

What's Next