(Marca i web)
Vanguard Academy
Marca i web per a una escola de ciberseguretat en castellà.
El repte
Una acadèmia nova que havia de sonar propera en un sector tècnic i fred, sense perdre rigor.
La solució
Una marca que recorda un videojoc, amb nivells, reptes i estètica cyberpunk, sobre un sistema ordenat que aporta el rigor.
El resultat
Una marca que s'entén d'un cop d'ull i un web que ja recull la llista d'espera dels primers alumnes.
(01)
Identitat
Una etiqueta trencada que signa com un atacant.
L'estètica surt dels neons, els glitches i els terminals hackejats. El símbol és una etiqueta de tancament trencada, la signatura que deixa qui entra en un sistema, i en el seu espai negatiu s'amaguen la V i la A.
Lliurables Direcció d'art · Logotip i versions · Paleta i tipografies · Iconografia · Manual de marca
Un fons gairebé negre i un verd que només apareix on hi ha acció. Els accents ordenen la resta.
Principals
- Matrix GreenAcció#03E21D
- Carbon BlackFons#0B080C
- Carbon WhiteText#FAFAFA
Accents
- Electric BlueAccent#3B9EFF
- Cyber PinkAccent#EC4899
- Amber OrangeAccent#E36B02
- Edgerunner PurpleAccent#8B5CF6
Titulars
Orbitron
Para los que entran primero
Interfície
Barlow Semi Condensed
Ciberseguridad aplicada al mundo real
Text
Exo 2
Laboratorios, retos y un portfolio verificable
Codi
Courier New
> acceso: ok
(02)
Aplicacions
La marca fora de la pantalla.
Targetes i marxandatge per a l'equip i la comunitat, sempre sobre fosc i amb el verd just.
Lliurables Targetes de visita · Marxandatge
(03)
Web
Una landing feta per convertir.
És estàtic, sense CMS, i tot el recorregut porta al formulari d'accés anticipat. Com que és d'una acadèmia de ciberseguretat, el web també havia de ser segur, així que en vam revisar les vulnerabilitats. I és accessible: es pot ampliar el text o canviar a una font per a la dislèxia.
Lliurables Landing page · Disseny UX/UI · Desenvolupament web · Captació de leads · Seguretat · Accessibilitat
1 objectiu
Que qui arriba deixi les seves dades al formulari d'accés anticipat.
Uneix-te
Sempre a mà al menú i a la portada, i porta directament al formulari.
Segur
Revisió de vulnerabilitats, capçaleres de seguretat estrictes i formulari protegit contra bots.
Estàtic
HTML, CSS i JavaScript propis, sense CMS ni plantilles.
Dislèxia
Mida de text ajustable i font Sylexiad a totes les pàgines.
100
Accessibilitat
Nota de Google Lighthouse: contrast, etiquetes i teclat en ordre.
Desplaça't dins de cada pantalla
Veure el web en directe ↗ (s'obre en una pestanya nova)“El branding ens ha sorprès. Heu aconseguit que una cosa visualment simple tingui un rerefons molt potent. Això del closing tag trencat, la V i la A amagades a l'espai negatiu, el concepte de la signatura de l'atacant… tot encaixa i té molt de sentit amb el que és Vanguard.”
Blanca Amorim, CEO i cofundadora · Vanguard Academy
Equip i crèdits
| Servei | Lidera | Suport |
|---|---|---|
| Logotip i iconografia | Odei Siruela | — |
| Branding | Odei Siruela | — |
| Disseny del manual de marca | Jota Reyes | — |
| Direcció d'art | Odei Siruela | Xuri FentonOddity |
| Disseny i desenvolupament web | Odei Siruela | — |
En parlem?
Explica'ns el teu projecte.
Pot ser una marca, un web, fotos o tot alhora. T'escoltem i et diem com ho faríem.