1
brand— identity design language / mark & logotype / design system / visual identity
Graphic designer Maria Nora Arnone No part of this publication may be reproduced or transmitted in any form or by any electronic, mechanical or other means without the written permission of the owners of the rights and the publisher. Publication composed in Basic Sans, designed by Daniel Hernández for Latinotype in 2016. © Copyright 2020 Ledgenda All rights reserved www.ledgenda.com
index 01 — design language
7
01.1 — about
8
01.2 — brand values
10
01.3 — design principles
12
02 — symbol & logotype
15
02.1 — the symbol
16
02.2 — the logotype
18
02.3 — typography
20
02.4 — symbol & logotype
22
02.5 — colors & gradients
24
02.6 — improper use
26
03 — visual assets
29
03.1 — visual design
30
04 — motion
35
04.1 — mark animation
36
04.2 — other elements
38
05 — print materials
43
05.1 — letterhead
44
05.2 — business card
46
05.3 — postcards
48
06 — digital assets
51
06.1 — website
52
06.2 — pitch
58
01 — design language
7
design language
01.1 — about
Ledgenda is a startup that aims to make the production chain transparent in order to generate circularity and lengthen the life cycle of products in order to make the supply chain sustainable both from a production point of view and as regards the impact of production on the environment.
8
9
01 — basics
To do this, it proposes to digitize physical products and to trace their entire life cycle in order to allow greater control over the data relating to the product, from when it is made to when it is sold. This digital passport is created through the internet of things, through nfc sensors present on the products that are updated every time they go through production phases or undergo maintenance interventions. The data is protected through blockchain mechanisms and made accessible to the final consumer by scanning the qr code placed on the product label.
The service offers benefits to various production sectors as, in addition to allowing sustainable production and a circular economy, it also offers the possibility of keeping track of large amounts of data regarding product performance and carrying out one-toone marketing activities. what allows to break down the barriers between the manufacturing company and the final consumer allowing a targeted communication based on the real needs and interests of the customer.
design language
10
01.2 — brand values Transparency
Sustainability
The brand moves with a view to innovating the supply chain through transparent and sincere communication between all the players involved.
The brand aims to emphasize the need for sustainable production in an era in which attention to the environment has become essential.
01 — basics
11
Future-oriented
Sustainability
Innovation means knowing how to look beyond. We are looking for a way to tangibly improve the production chain in order to make the industry intentionally transparent and to implement sustainable production by breaking down barriers.
We want to take care of our planet and those who inhabit it. Sustainability for us is not an option but the only way forward.
design language
01.3 — design principles The adaptive approach and the need for an MVP that adapts to the most varied markets have made it possible to place both accessibility and inclusiveness at the center of the design process in order to create a product that can be used from time to time as a a transparent container on all levels.
12
01 — basics
13
Inclusiveness
Accessibility
The brand aims to clarify complex processes in order to include as many users as possible
In 2021 it is impossible to design without considering accessibility. Each artifact must comply with WCGA limits regarding contrast ratio, font size and use of colors
3D space Ledgenda is a service that acts on several dimensions: for this reason we have chosen to design taking into account the three-dimensional space in order to guarantee plasticity to the visual artifacts where required.
02 — symbol & logotype
symbol & logotype
02.1 — the symbol The symbol develops around the concept of “levels” as Ledgenda represents a layer that is interposed between the links of the production chain in order to put them in communication. Through the cuts, the shape of the letter L is made visible, oriented isometric in space.
16
02 — brand
Mark elements and geometric construction. Everything has been designed through a modular isometric grid
17
symbol & logotype
18
02.2 — the logotype Kerning optical correction The mark is flanked by the logotype, composed in Basic Sans (about which details will be provided on the next page), to which optical corrections relating to kerning have been applied. A modulus was calculated, representing the fortieth part of the lowercase letter w, used to define kerning values between letters
Optical kerning correction is useful in providing the logotype with compactness and a smoother visual rhythm in order to make it visible even at lower dimensions.
40x 1x
2x
1x
x
02 — brand
19
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789|!ӣ$%&/()=? ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789|!ӣ$%&/()=?
-1x
2x
2x
2x
2x
symbol & logotype
20
02.3 — typography Basic Sans The font chosen is Latinotype Basic Sans. It is a humanistic sans serif that stands out for its sinuous but not excessive curves and has a vaguely horizontal direction.
ABCDEFGHIJKLM NOPQRSTUVWXYZ abcdefghijklm nopqrstuvwxyz 0123456789 |!ӣ$%&/()=? ABCDEFGHIJKLM NOPQRSTUVWXYZ abcdefghijklm nopqrstuvwxyz 0123456789 |!ӣ$%&/()=?
Specimen and anatomy The specimen of the typeface is shown on the side. The weights used are regular and bold. Typeface anatomy is shown. In particular we can see: baseline, x-height, lower case ascenders, upper case, lower case descendants and accented uppercase.
02 — brand
Rag Rag
21
Peculiarities The letters have a vertical axis in counters and a slightly horizontal development in construction. Terminals are almost diagonal giving the typeface a human touch. Beside are shown some peculiarities like the R tail, the a counter and the g ear.
symbol & logotype
22
02.4 — symbol & logotype The definition of the proportions is useful for a correct use of the brand in terms of size and positioning, even with other elements. These pages show proportions, safe area and recommended minimum size in order to ensure the mark to be correctly used.
4 mm
5 mm
10 mm
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Enim, dapibus ante in pretium integer pellentesque ligula. Congue in pulvinar convallis leo nam a, Imincto blabore simus que volendit et,
4 mm
3 mm
23
02 — brand
x
x
y 1/2 y
x
x
x
x
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Enim, dapibus ante in pretium integer pellentesque ligula. Congue in pulvinar convallis leo nam a, Imincto blabore simus que volendit et,
24
symbol & logotype
02.5 — colors & gradients For printing materials the advice is to use just pure black or white for the mark and to use the colors only on the visual assets. For digital purposes it has been chosen a palette that contains a really light gray and a dark grey as primary colors, a red for accent color and a subtle gradient for tone down when needed.
Primary light #E3E3E3 RGB 227, 227, 227 CMYK 4, 3, 3
Primary dark # 363840 RGB 54, 56,64 CMYK 75, 64, 51, 56
Gradient linear gradient #E3657A #FBDCD6
Accent # EA5141 RGB 234, 81, 65 CMYK 0, 79, 72, 0
02 — brand
25
symbol & logotype
02.6 — improper use On the opposite page the improper uses of the trademark are shown. In order to ensure consistency in communication and guarantee harmony and proportions for the brand, we strongly advise against any use not provided for in this manual.
26
27
02 — brand
The proportions of the brand must be respected, any kind of deformation is highly discouraged.
The logotype, if present, must always have the same color as the symbol, respecting the institutional colors.
No changes can be made to the elements of the mark.
It is not recommended to use the mark negative version on very light backgrounds for reasons of legibility.
03 — visual assets
visual assets
03.1 — visual design As far as the visuals are concerned, it was decided to place the emphasis on materials and depth. For this reason, the visuals were created in 3D with the use of highly reflective and translucent materials. The glass to symbolize the concept of transparency undergoes a displacement to allow you to see a wider spectrum of colors - to symbolize the concept of seeing beyond - while the metal, reflecting the light, allows you to illuminate the scene even more clearly. The shapes used are the basic geometric ones in order to make the perception of the brand as something intangible which however allows you to see things from a different point of view.
30
03 — visual basics
31
visual assets
32
03 — visual basics
33
Some examples of visual assets where glass and metal are mixed together. The ring represents the concept of circularity.
34
04 — motion
35
motion
04.1 — mark animation Mark animation follows the principles and techniques of morphing. Strong emphasis is placed on the symbol animation: the square spins and morphs into an exagon that reveals the symbol by showing the cuts. The logotype animation is far more simple, and represents an appearance from left to right by using a track matte shape. This kind of animation must be used for introducing the brand, such as in pitch covers, website loader or digital products splash screens.
36
04 — mark animation
motion
04.2 — other elements For communication assets, as for the website header, it is recommended to use 3D elements, such as the glass shader, in order to design highly interactive and dynamic content. In this case the glass solid interacts with mouse cursor by moving on the y-axis and spinning slowly.
38
04 — videos
39
motion
Smooth scroll Other animations can be used specifically on the website, such as smooth scroll in order to enrich the website experience.
40
04 — web animations
Custom cursor Custom animated cursors can enhance the experience on the landing page by leading the user to interact with the most important content.
41
05 — print materials
print materials
05.1 — letterhead
44
05 — stationery
Size A4 (210x297 mm); bleed 3 mm; grid modular, 5x8; margins 10, 20, 40, 30 mm; gutter 5 mm; The sketched line at 97mm indicates where to fold.
45
Printing on plain 130 gsm paper is recommended. Composed in Basic Sans regular 7/8.4 pt for sender addresses; 10/12 pt for the recipient’s address and for the body text.
print materials
05.2 — business card
Mario Bianchi CEO & founder
+393200000000 mario@ledgenda.com
ledgenda.org
Size 55x85 mm; bleed 3 mm; grid modular, 3x3; margins 5 mm; gutter 3 mm;
46
05 — stationery
Printing on multilayer textured, 600gsm Mohawk paper is recommended. Composed in Basic Sans regular 12/16 pt for name; Basic Sans italic 8/10 pt for role and bold for email and phone.
47
print materials
05.3 — postcards
48
05 — stationery
Size 130x210 mm; bleed 3 mm; grid modular, 5x8; margins 10 mm; gutter 5 mm;
49
Printing on 600 gsm Uncoated, naturally textured Mohawk Superfine paper is recommended.
06 — digital assets
digital assets
06.1 — website
52
06— website
The website consists of a one-page which has the purpose to illustrate mission and services in order to generate leads from companies interested into participating to the project. In the following pages are shown all the sections of the page, designed both for desktop and mobile.
53
digital assets
54
55
digital assets
56
06— website
57
digital assets
06.2 — pitch
58
06— slides
The pitch master deck is useful in case of a project presentation or SAL with investors. It needs to be flexible enough to provide the right layout for every eventuality. The deck consists of a series of masters representing the most recursive parts of presentations both in light and dark mode, beside of more generic pages with neat but flexible layout.
59
All the pitch masters in both light and dark versions.
© Copyright 2020 Ledgenda All rights reserved www.ledgenda.com
©2021 Ledgenda — All rights reserved