Chercher une page/
Projets — 01 / 05

OGGO

Conseil informatique Apple à Genève depuis 2010. Une marque et un site repris de zéro, puis mesurés jusqu’à la dernière section.

Période2024–2026LieuGenève
RôleLa chaîne entièreEn ligneoggo.ch
MétiersIdentité · Édition & print · Interface · Développement · Marketing digital
LivréMarque, site, mesure, campagnes

Rien n’a été récupéré. L’identité, la grille, la typographie et le site ont été repris de zéro, puis mesurés, écran par écran, jusqu’à ce que plus une section ne soit coupée.

Le projet, en images ↓
Dessiné · 01

La direction artistique

Le logotype, la typographie, la papeterie et les objets : une marque pensée pour tenir aussi hors de l’écran, sur une carte, un t-shirt, une enseigne.

VisuelLe logotype dans ses quatre états : plein, ajouré, sur clair, sur sombre. Les quatre lettres tiennent dans un carré de deux sur deux : c’est ce qui lui permet de devenir favicon sans rien perdre.
VisuelLe spécimen de HK Nova sur le rouge d’OGGO. La police porte les grands titres ; le texte courant passe en SF Pro, celle du système Apple, un choix de cohérence avec le métier du client, pas de goût.
VisuelLa papeterie. La carte ne porte ni slogan ni liste de services : un nom, une fonction, un numéro. C’est la pièce qu’on tend en fin de rendez-vous, pas une plaquette.
VisuelLes objets. Le logotype y passe en aplat, sans dégradé ni relief : la contrainte vient de l’impression sur textile et sur métal, et elle a servi de test : une marque qui survit à la sérigraphie survit à tout.
VisuelLe t-shirt d’équipe. Le logotype descend à la taille d’un badge et se place haut, côté cœur : porté par un technicien chez un client, il doit s’identifier de loin sans jamais crier.
VisuelLa planche technique. Elle fixe la couleur, la typographie et leurs déclinaisons : c’est elle qui fait foi le jour où un imprimeur, un fournisseur ou un développeur demande la référence exacte. Les valeurs précises ne sont pas publiées ici : elles vivent dans l’espace client, à une adresse qui ne bouge pas.
le rouge
le noir
le gris de texte
le gris de fond
HK Novagrands titres
SF Protexte courant · système Apple
Construit · 02

L’interface — bureau

Le site d’OGGO sur grand écran, là où ses clients le consultent le plus.

VisuelL’accueil. Une promesse en deux lignes, dont deux mots soulignés (« Mac compris »), et en face une colonne qui ne vend rien : six phrases de client, écrites comme il les dirait. Le visiteur se reconnaît avant qu’on lui ait parlé de nous.
VisuelLes études de cas. Le titre compte six maisons, et l’encart d’à côté dit ce qu’on ne fera pas : aucun chiffre qu’on ne puisse montrer, aucun témoignage écrit à la place du client. Une page de références qui commence par ses propres limites.
VisuelLa page d’infogérance. À gauche la douleur en trois phrases, à droite huit étiquettes de ce qui est pris en charge, et dessous la seule ligne qui distingue vraiment : le Mac est le métier d’OGGO, et le partenariat Microsoft existe aussi. Le client n’a pas à choisir son camp.
VisuelLa page qui raconte l’entreprise. Deux enseignes, un seul atelier, la même adresse : l’entreprise est racontée comme une continuité, pas comme un organigramme. Une pastille de couleur suffit à séparer les deux marques : rouge pour les entreprises, jaune pour les particuliers.
Construit · 03

L’interface — téléphone

Les mêmes pages, redessinées et non rétrécies. C’est là que la moitié des visites arrive.

VisuelL’accueil sur téléphone. Le titre garde ses deux poids et son trait rouge ; la colonne des six phrases ne se pose plus à côté, elle descend sous la promesse. Rien n’a été retiré : c’est l’ordre de lecture qui a changé.
VisuelLes études de cas sur téléphone. Le chapô, la ligne d’appel et l’encart s’empilent dans l’ordre où on les lit, et le numéro reste à portée de pouce : sur ce site, il n’est jamais à plus d’un écran.
VisuelL’infogérance sur téléphone. Les deux colonnes deviennent une seule suite, et ce sont les numéros en rouge, 01, 02, qui tiennent le fil : sur un écran étroit, la numérotation fait le travail que faisait la mise en colonnes.
Visuel« La maison » sur téléphone. Les deux enseignes passent l’une sous l’autre, chacune avec sa pastille, et l’adresse reste juste sous la ligne d’appel. La même page, dans le même ordre : il n’y a pas de version allégée pour téléphone.
Construit · 04

Le développement

Ce qui ne se voit pas d’un coup d’œil, et qui fait qu’un site tient : le logotype vectoriel, le contraste mesuré, la grille du pied, le plan du site.

VisuelLes six services, une carte chacun. Chaque ligne porte son numéro, son picto, sa phrase d’une ligne et sa flèche : un sommaire qui se lit en diagonale, et qui ouvre sur « urgence » plutôt que sur un catalogue.
VisuelUne étude de cas, en pleine lecture. Les chiffres sont en gras dans les phrases, pas dans des cartouches : neuf téraoctets sauvegardés en continu, vingt-neuf postes gérés à distance. Et la section suivante les remet dans la durée, ce qui est la seule preuve qui compte.
VisuelLe pied de page. Quatre colonnes, l’adresse, les horaires, et une ligne qu’on ne trouve presque nulle part ailleurs : « Ouvert demain à 8 h 30 ». C’est la réponse à la question qu’on se pose à 19 h, écrite à l’endroit où on la cherche.
VisuelLa page de contact. Le titre nomme la rue, le formulaire ne demande que quatre choses dont une facultative, et la colonne de droite met le téléphone en premier. « Le plus rapide reste le téléphone » est écrit noir sur blanc : un formulaire qui ne se prétend pas le meilleur chemin.
Welcome to the Machine
Accès clients · une adresse, un mot de passe par espace
Votre espace client↗espace.wttm.ch
WTTM Rue Jean-Gutenberg, 3bis, 1201 Genève InstagramBehanceAwwwards Mentions · Confidentialité · © 2026
Chercher une pageChercher/