{"id":980,"date":"2016-03-22T15:23:31","date_gmt":"2016-03-22T14:23:31","guid":{"rendered":"https:\/\/graphiste.com\/blog\/?p=980"},"modified":"2016-03-22T15:23:31","modified_gmt":"2016-03-22T14:23:31","slug":"prototypo","status":"publish","type":"post","link":"https:\/\/graphiste.com\/blog\/prototypo\/","title":{"rendered":"Prototypo, cr\u00e9ez votre propre typographie sur-mesure en quelques clics"},"content":{"rendered":"<p>Prototypo est une application en ligne qui permet \u00e0 chacun de cr\u00e9er \u00e0 partir de 2 mod\u00e8les de base (un sans empattements + un avec) une typographie qui sera adapt\u00e9e aux besoins finaux dans son contexte final.<\/p>\n<p class=\"p1\"><span class=\"s1\">Nous avons propos\u00e9 \u00e0 Prototypo de pr\u00e9senter leur service sur le blog gracieusement car nous adorons ce concept et que nous souhaitons mettre en avant des jeunes pousses dans le domaine du design. <\/span><\/p>\n<p>Pas besoin de connaissances requises ou de comp\u00e9tences techniques, il suffit de r\u00e9gler la trentaine de param\u00e8tres \u00e0 l\u2019aide des curseurs. Chaque r\u00e9glage se r\u00e9percute sur l\u2019ensemble de l\u2019alphabet. En quelques minutes, l\u2019utilisateur peut exporter un fichier de police de caract\u00e8res classique et l\u2019utiliser dans ses logiciels de cr\u00e9ation, ou sur le web, comme n\u2019importe quelle autre police.<\/p>\n<h3><\/h3>\n<h2>Peux-tu te pr\u00e9senter&nbsp;?<\/h2>\n<p>Dans l&#8217;\u00e9quipe, nous sommes 2 cofondateurs: Louis-R\u00e9mi Bab\u00e9, d\u00e9veloppeur, et Yannick Mathey, graphiste. Avant de commencer l&#8217;aventure Prototypo, nous avons tous les deux \u00e9t\u00e9 freelances pour des clients: design de sites web, design interactif plus largement.<\/p>\n<p>Trois ans apr\u00e8s le dipl\u00f4me de Yannick (2010) durant lequel une premi\u00e8re version a \u00e9t\u00e9\u00a0d\u00e9velopp\u00e9e, Louis-R\u00e9mi a envoy\u00e9 un mail \u00e0 Yannick pour savoir o\u00f9 en \u00e9tait le d\u00e9veloppement. Apr\u00e8s quelques pr\u00e9sentations et une bi\u00e8re, ils ont d\u00e9cid\u00e9 de travailler ensemble, d&#8217;abord un soir par semaine, puis \u00e0 temps plein sur le projet. Apr\u00e8s une campagne de financement participatif r\u00e9ussie sur Kickstarter (juin 2014) l&#8217;\u00e9quipe d\u00e9cide de s&#8217;impliquer durablement sur Prototypo.<\/p>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-994\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/team-prototypo.png\" alt=\"team-prototypo\" width=\"400\" height=\"273\" \/><\/p>\n<h3><\/h3>\n<h2>Peux-tu nous pr\u00e9senter ton produit&nbsp;?<\/h2>\n<p>Prototypo est une application en ligne qui permet \u00e0 tous de cr\u00e9er sa propre police de caract\u00e8res sur-mesure. Une trentaine de curseurs permettent de modifier les formes et proportions de chaque lettre, et ces modifications se r\u00e9percutent sur l&#8217;ensemble de l&#8217;alphabet.<\/p>\n<p>\u00c0 partir de deux templates de base (un sans-serif et un Garalde) on peut cr\u00e9er un grand nombre de variantes de formes tr\u00e8s diff\u00e9rentes. Une fois que l&#8217;utilisateur est satisfait du r\u00e9sultat, il n&#8217;a plus qu&#8217;\u00e0 t\u00e9l\u00e9charger la police et l&#8217;utiliser comme n&#8217;importe quelle autre typographie.<\/p>\n<p>&nbsp;<\/p>\n<h2>Comment as-tu eu\u00a0l&#8217;id\u00e9e&nbsp;?<\/h2>\n<p>Yannick a suivi une formation de designer graphique aux Arts D\u00e9coratifs de Strasbourg (HEAR). Comme tout graphiste il utilise tous les jours des polices de caract\u00e8res et comme tout graphiste il a d\u00e9j\u00e0 essay\u00e9 de dessiner sa propre typo.<\/p>\n<p>Malheureusement, c&#8217;est une discipline qui demande non seulement une grande ma\u00eetrise des outils et de l&#8217;Histoire de la typo, mais aussi de nombreuses heures de travail: dessiner une police compl\u00e8te prend de plusieurs semaines \u00e0 plusieurs mois pour un professionnel de la typo.<\/p>\n<p>C&#8217;est \u00e0 partir de la frustration de ne pas pouvoir dessiner ses propres typos pour ses projets graphiques que Yannick a d\u00e9cid\u00e9 de travailler durant son DNSEP sur un outil qui permettrait de gagner du temps dans cette pratique: un alphabet est un syst\u00e8me, et comme tout syst\u00e8me il a des r\u00e8gles r\u00e9currentes; on peut alors &#8220;coder&#8221; et automatiser\u00a0lesdites\u00a0r\u00e8gles. Au bout d&#8217;un an, une premi\u00e8re version\u00a0d\u00e9velopp\u00e9e sous Processing \u00e9tait n\u00e9e. (Prototypo Alpha:\u00a0<a href=\"https:\/\/vimeo.com\/24358631\" target=\"_blank\" rel=\"noopener noreferrer\">https:\/\/vimeo.com\/24358631<\/a>)<\/p>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-995\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/thumb-KS.jpg\" alt=\"thumb-KS\" width=\"640\" height=\"480\" \/><\/p>\n<h3><\/h3>\n<h2>Quel est le point fort de ta solution&nbsp;?<\/h2>\n<p>Prototypo permet en quelques minutes et de mani\u00e8re tr\u00e8s intuitive de cr\u00e9er un prototype typographique. Sa simplicit\u00e9 d&#8217;utilisation permet de rapidement poser les bases d&#8217;un design et ensuite de venir retoucher celui-ci dans un logiciel traditionnel pour corriger les d\u00e9tails.<\/p>\n<p>On gagne alors un temps consid\u00e9rables sur des t\u00e2ches r\u00e9p\u00e9titives qui sont souvent d\u00e9nu\u00e9es de sens cr\u00e9atif. Dans un contexte d&#8217;appel d&#8217;offre, de cr\u00e9ation de logos ou simplement d&#8217;une pure cr\u00e9ation, Prototypo peut \u00eatre tr\u00e8s utile pour rentabiliser le temps des graphistes qui peut s&#8217;av\u00e9rer tr\u00e8s cher\u2026<\/p>\n<p>&nbsp;<\/p>\n<h2>Quelles sont les prochaines features du produit&nbsp;?<\/h2>\n<p>Nous proposons actuellement 2 gabarits de base au sein de l&#8217;application. La prochaine \u00e9tape est d&#8217;en ajouter toujours plus, dans des styles diff\u00e9rents, pour accro\u00eetre les possibilit\u00e9s.<\/p>\n<p>L&#8217;application \u00e9tant sur le web, nous souhaitons aussi ajouter des options pour visualiser en temps r\u00e9el les modifications sur un site web existant: on peut dessiner sa typo en prenant en compte son usage final, au sein d&#8217;une maquette web; \u00e0 terme, nous aimerions aussi int\u00e9grer le m\u00eame principe dans les applications qu&#8217;utilisent tous les graphistes: Illustrator, Photoshop, etc.<\/p>\n<p>Pour finir, nous allons aussi cr\u00e9er des outils pour permettre aux utilisateurs plus avertis de cr\u00e9er eux-m\u00eames des gabarits param\u00e9triques pour qu&#8217;ils puissent les redistribuer, un peu \u00e0 la mani\u00e8re des th\u00e8mes WordPress sur ThemeForrest.<\/p>\n<p>&nbsp;<\/p>\n<h2>Zoom sur le fonctionnement de\u00a0prototypo<\/h2>\n<p>Une d\u00e9mo est pr\u00e9sente sur l\u2019accueil du site, <a href=\"https:\/\/www.prototypo.io\/\">www.prototypo.io<\/a>&nbsp;:<\/p>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-981\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-1.jpg\" alt=\"prototypo-1\" width=\"946\" height=\"719\" \/><\/p>\n<p>Une fois connect\u00e9e \u00e0 l\u2019application, il suffit de cr\u00e9er son premier projet gr\u00e2ce au menu <em>Collection<\/em> situ\u00e9 dans la barre lat\u00e9rale gauche et de renseigner son nom et le mod\u00e8le de base que l\u2019on souhaite utiliser\u00a0:<\/p>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-982\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-2.jpg\" alt=\"prototypo-2\" width=\"946\" height=\"691\" \/><\/p>\n<p>\u2014 interface pour cr\u00e9er un nouveau projet<\/p>\n<p>L\u2019application comporte 3 vues diff\u00e9rentes que l\u2019on peut afficher ou masquer avec le menu pr\u00e9sent en haut \u00e0 droite\u00a0:<\/p>\n<ul>\n<li>une vue glyphe qui permet de voir en d\u00e9tail les modifications sur la lettre,<\/li>\n<li>une vue mot pour appr\u00e9hender la silhouette de l\u2019alphabet et comprendre la relation entre les lettres,<\/li>\n<li>une vue paragraphe pour visualiser la qualit\u00e9 du gris optique sur des textes en petits corps.<\/li>\n<\/ul>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-983\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-3.jpg\" alt=\"prototypo-3\" width=\"946\" height=\"718\" \/><\/p>\n<p><em>\u2014 3 vues sont disponibles pour convenir \u00e0 toutes les \u00e9chelles d\u2019un dessin de caract\u00e8res<\/em><\/p>\n<p>Tous les param\u00e8tres sont pr\u00e9sents dans la barre lat\u00e9rale, et divis\u00e9s en 3 cat\u00e9gories\u00a0: param\u00e8tres fonctionnels (hauteurs, etc.), param\u00e8tres stylistiques (graisse de la lettre, etc.) et tout ce qui concerne les empattements dans un 3<sup>e<\/sup> onglet.<\/p>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-984\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-4.jpg\" alt=\"prototypo-4\" width=\"946\" height=\"802\" \/><\/p>\n<p><em>\u2014 3 onglets d\u00e9coupent les diff\u00e9rents curseurs en fonction de leur sp\u00e9cificit\u00e9<\/em><\/p>\n<p>Chaque curseur est param\u00e9tr\u00e9 pour avoir une amplitude optimale, permettant parfois d\u2019entrer une phase de cr\u00e9ation plus exp\u00e9rimentale\u00a0; le curseur se teinte alors de rouge pour signaler cette phase.<\/p>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-985\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-5.jpg\" alt=\"prototypo-5\" width=\"564\" height=\"139\" \/><\/p>\n<p><em>\u2014 Le curseur passe en rouge lorsqu\u2019on entre dans une phase qui risque d\u2019\u00eatre exp\u00e9rimentale<\/em><\/p>\n<p>Le dessin de polices de caract\u00e8res est affaire de rythme, parfois en brisant un syst\u00e8me trop rigide. Pour cela, il existe une option qui permet d\u2019individualiser des lettres ou groupes de lettres. Il est donc possible de cr\u00e9er des lettres plus larges que d\u2019autres ou tout autre modification sp\u00e9cifique\u00a0:<\/p>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-986\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-6.jpg\" alt=\"prototypo-6\" width=\"946\" height=\"616\" \/><\/p>\n<p><em>\u2014 Cr\u00e9er du rythme dans les polices de caract\u00e8res (GIF)<\/em><\/p>\n<p>Pour cr\u00e9er un groupe d\u2019individualisation, il suffit de cliquer sur l\u2019ic\u00f4ne en bas \u00e0 droite ou dans le menu sup\u00e9rieur\u00a0: <em>edit<\/em> &gt; <em>individualize parameters.<\/em><\/p>\n<p><em><img decoding=\"async\" class=\"aligncenter size-full wp-image-987\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-7.jpg\" alt=\"prototypo-7\" width=\"235\" height=\"98\" \/><\/em><\/p>\n<p><em>\u2014 Activer le mode \u00ab\u00a0individualisation\u00a0\u00bb<\/em><\/p>\n<p>Appara\u00eet alors un panneau permettant de cr\u00e9er un groupe. Celui-ci int\u00e8gre directement la lettre en cours de modification dans la vue glyphe. Apr\u00e8s avoir nomm\u00e9 ce groupe\u00a0, on peut lui associer d\u2019autres lettres qui auront les m\u00eames sp\u00e9cificit\u00e9s que celle pr\u00e9-s\u00e9lectionn\u00e9e.<\/p>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-988\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-8.jpg\" alt=\"prototypo-8\" width=\"921\" height=\"952\" \/><\/p>\n<p><em>\u2014 Panneau de cr\u00e9ation de groupe d\u2019individualisation<\/em><\/p>\n<p>Une fois le groupe cr\u00e9\u00e9, l\u2019interface se teinte de jaune pour signifier que l\u2019on se trouve dans le mode \u00ab\u00a0individualisation\u00a0\u00bb\u00a0:<\/p>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-989\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-9.jpg\" alt=\"prototypo-9\" width=\"946\" height=\"719\" \/><\/p>\n<p><em>\u2014 Interface du mode d\u2019individualisation<\/em><\/p>\n<p>Il existe deux mani\u00e8res de modifier ces param\u00e8tres individualis\u00e9s\u00a0: en px (valeur en absolue par rapport au r\u00e9glage initial) et en % (valeur relative aux r\u00e9glages globaux de l\u2019alphabet).<\/p>\n<p>Pour passer d\u2019un mode \u00e0 l\u2019autre, chaque curseur poss\u00e8de une ic\u00f4ne qui permet ce changement\u00a0:<\/p>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-990\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-10.jpg\" alt=\"prototypo-10\" width=\"946\" height=\"80\" \/><\/p>\n<p><em>\u2014Diff\u00e9rents \u00e9tats pour passer du mode absolu au mode relatif<\/em><\/p>\n<p>Une fois tous les r\u00e9glages effectu\u00e9s, il ne reste plus qu\u2019\u00e0 exporter. L\u00e0 encore il existe plusieurs types d\u2019export\u00a0:<\/p>\n<ul>\n<li><em>Export to merged OTF<\/em> permet d\u2019exporter une police pr\u00eat \u00e0 l\u2019emploi o\u00f9 toutes les formes qui composent la lettre ont \u00e9t\u00e9 fusionn\u00e9s en un contour unique.<\/li>\n<li><em>Export to OTF<\/em> cr\u00e9e un fichier de police o\u00f9 les formes n\u2019ont pas \u00e9t\u00e9 d\u00e9compos\u00e9es. On peut alors affiner la police dans un outil de dessin typographique tel que FontForge (Open-Source)<\/li>\n<li><em>Export to Glyphr Studio<\/em> ouvre une nouvelle fen\u00eatre vers le site de <em>Glyphr <\/em>qui est un outil en ligne d\u2019\u00e9dition manuel de polices de caract\u00e8res. <\/li>\n<\/ul>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-991\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-11.jpg\" alt=\"prototypo-11\" width=\"946\" height=\"434\" \/><\/p>\n<p><em>&#8211; Diff\u00e9rence entre un export merg\u00e9 et un non-merg\u00e9<\/em><\/p>\n<p>Vous venez de cr\u00e9er votre premi\u00e8re police de caract\u00e8re, et il serait utile d\u2019ajouter des variantes \u00e0 celle-ci\u00a0! \u00c0 partir de ce que vous venez de cr\u00e9er, il est possible d\u2019ajouter un bold, un italique, une version condens\u00e9e, etc.<\/p>\n<p>Pour cela, revenir dans le menu <em>Collection<\/em> et cliquer sur le nom de la police que vous venez de modifier, puis cliquer sur <em>Add a variant.<\/em><\/p>\n<p>Si vous choisissez un nom pr\u00e9d\u00e9fini, tel que <em>Bold,<\/em> la graisse sera alors automatiquement adapt\u00e9e en fonction de ce type de variante.<\/p>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-992\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-12.jpg\" alt=\"prototypo-12\" width=\"946\" height=\"556\" \/><\/p>\n<p><em>&#8211; Menu de gestion de projet et cr\u00e9ation de variantes.<\/em><\/p>\n<p>Voil\u00e0\u00a0!<\/p>\n<p>Il existe deux offres pour utiliser Prototypo\u00a0: une version gratuite, limit\u00e9e \u00e0 6 param\u00e8tres, et une \u00e0 partir de 15\u20ac par mois o\u00f9 vous pouvez cr\u00e9er un nombre illimit\u00e9 de polices. (pensez \u00e0 l\u2019offre annuel, 2 mois sont offerts\u00a0!)<\/p>\n<p>Les prochains d\u00e9veloppement \u00e0 venir au sein de l\u2019application\u00a0: <\/p>\n<ul>\n<li>Une nouvelle police de caract\u00e8re, un elzevir.<\/li>\n<li>Possibilit\u00e9 de synchroniser un site internet et de voir \u00e9voluer la police dessus en temps r\u00e9el.<\/li>\n<li>Des outils pour modifier manuellement la police, directement dans l\u2019application, en conservant les comportements automatiques ensuite.<\/li>\n<li>Les options de spacing (interlettrage) et kerning (approche de paires) automatiques.<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Prototypo est une application en ligne qui permet \u00e0 chacun de cr\u00e9er \u00e0 partir de 2 mod\u00e8les de base (un sans empattements + un avec) une typographie qui sera adapt\u00e9e aux besoins finaux dans son contexte final. Nous avons propos\u00e9 \u00e0 Prototypo de pr\u00e9senter leur service sur le blog gracieusement car nous adorons ce concept [&hellip;]<\/p>\n","protected":false},"author":5,"featured_media":981,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[27],"tags":[],"class_list":["post-980","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-webdesign"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.9 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Prototypo, cr\u00e9ez votre propre typographie<\/title>\n<meta name=\"description\" content=\"Prototypo est une application en ligne qui permet \u00e0 chacun de cr\u00e9er \u00e0 partir de 2 mod\u00e8les de base (un sans empattements + un avec) une typographie qui\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/graphiste.com\/blog\/prototypo\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Prototypo, cr\u00e9ez votre propre typographie\" \/>\n<meta property=\"og:description\" content=\"Prototypo est une application en ligne qui permet \u00e0 chacun de cr\u00e9er \u00e0 partir de 2 mod\u00e8les de base (un sans empattements + un avec) une typographie qui\" \/>\n<meta property=\"og:url\" content=\"https:\/\/graphiste.com\/blog\/prototypo\/\" \/>\n<meta property=\"og:site_name\" content=\"Graphiste.com\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/graphistesfreelances\" \/>\n<meta property=\"article:published_time\" content=\"2016-03-22T14:23:31+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-1-1.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"946\" \/>\n\t<meta property=\"og:image:height\" content=\"719\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Thomas Lazzaroni\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@totolazza\" \/>\n<meta name=\"twitter:site\" content=\"@Graphistecom\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"Thomas Lazzaroni\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"8 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/graphiste.com\/blog\/prototypo\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/graphiste.com\/blog\/prototypo\/\"},\"author\":{\"name\":\"Thomas Lazzaroni\",\"@id\":\"https:\/\/graphiste.com\/blog\/#\/schema\/person\/cc3b0a678aeffcae19ecc599eaf679e5\"},\"headline\":\"Prototypo, cr\u00e9ez votre propre typographie sur-mesure en quelques clics\",\"datePublished\":\"2016-03-22T14:23:31+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/graphiste.com\/blog\/prototypo\/\"},\"wordCount\":1666,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/graphiste.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/graphiste.com\/blog\/prototypo\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-1-1.jpg\",\"articleSection\":[\"Webdesign\"],\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/graphiste.com\/blog\/prototypo\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/graphiste.com\/blog\/prototypo\/\",\"url\":\"https:\/\/graphiste.com\/blog\/prototypo\/\",\"name\":\"Prototypo, cr\u00e9ez votre propre typographie\",\"isPartOf\":{\"@id\":\"https:\/\/graphiste.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/graphiste.com\/blog\/prototypo\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/graphiste.com\/blog\/prototypo\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-1-1.jpg\",\"datePublished\":\"2016-03-22T14:23:31+00:00\",\"description\":\"Prototypo est une application en ligne qui permet \u00e0 chacun de cr\u00e9er \u00e0 partir de 2 mod\u00e8les de base (un sans empattements + un avec) une typographie qui\",\"breadcrumb\":{\"@id\":\"https:\/\/graphiste.com\/blog\/prototypo\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/graphiste.com\/blog\/prototypo\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/graphiste.com\/blog\/prototypo\/#primaryimage\",\"url\":\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-1-1.jpg\",\"contentUrl\":\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-1-1.jpg\",\"width\":946,\"height\":719},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/graphiste.com\/blog\/prototypo\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Blog\",\"item\":\"https:\/\/graphiste.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Webdesign\",\"item\":\"https:\/\/graphiste.com\/blog\/webdesign\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Prototypo, cr\u00e9ez votre propre typographie sur-mesure en quelques clics\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/graphiste.com\/blog\/#website\",\"url\":\"https:\/\/graphiste.com\/blog\/\",\"name\":\"Graphiste.com\",\"description\":\"graphiste\",\"publisher\":{\"@id\":\"https:\/\/graphiste.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/graphiste.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/graphiste.com\/blog\/#organization\",\"name\":\"Graphiste.com\",\"url\":\"https:\/\/graphiste.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/graphiste.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2022\/07\/logo-blog-graphiste.svg\",\"contentUrl\":\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2022\/07\/logo-blog-graphiste.svg\",\"width\":1,\"height\":1,\"caption\":\"Graphiste.com\"},\"image\":{\"@id\":\"https:\/\/graphiste.com\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/graphistesfreelances\",\"https:\/\/x.com\/Graphistecom\",\"https:\/\/www.linkedin.com\/company\/graphiste-com\/\",\"https:\/\/fr.pinterest.com\/Graphiste_Com\",\"https:\/\/www.instagram.com\/graphiste_com\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/graphiste.com\/blog\/#\/schema\/person\/cc3b0a678aeffcae19ecc599eaf679e5\",\"name\":\"Thomas Lazzaroni\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/graphiste.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/7306fb87b7017ab0955d07c2f2b771ac79e91965a2fca514df0c043f7c087fd2?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/7306fb87b7017ab0955d07c2f2b771ac79e91965a2fca514df0c043f7c087fd2?s=96&d=mm&r=g\",\"caption\":\"Thomas Lazzaroni\"},\"description\":\"Depuis plus de 10 ans, je contribue \u00e0 faire rayonner nos sites en imaginant des strat\u00e9gies qui renforcent notre visibilit\u00e9 et notre position de r\u00e9f\u00e9rence.\",\"sameAs\":[\"https:\/\/www.linkedin.com\/in\/thomaslazzaroni\/\",\"https:\/\/x.com\/totolazza\"],\"url\":\"https:\/\/graphiste.com\/blog\/author\/thomas\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Prototypo, cr\u00e9ez votre propre typographie","description":"Prototypo est une application en ligne qui permet \u00e0 chacun de cr\u00e9er \u00e0 partir de 2 mod\u00e8les de base (un sans empattements + un avec) une typographie qui","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/graphiste.com\/blog\/prototypo\/","og_locale":"fr_FR","og_type":"article","og_title":"Prototypo, cr\u00e9ez votre propre typographie","og_description":"Prototypo est une application en ligne qui permet \u00e0 chacun de cr\u00e9er \u00e0 partir de 2 mod\u00e8les de base (un sans empattements + un avec) une typographie qui","og_url":"https:\/\/graphiste.com\/blog\/prototypo\/","og_site_name":"Graphiste.com","article_publisher":"https:\/\/www.facebook.com\/graphistesfreelances","article_published_time":"2016-03-22T14:23:31+00:00","og_image":[{"width":946,"height":719,"url":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-1-1.jpg","type":"image\/jpeg"}],"author":"Thomas Lazzaroni","twitter_card":"summary_large_image","twitter_creator":"@totolazza","twitter_site":"@Graphistecom","twitter_misc":{"\u00c9crit par":"Thomas Lazzaroni","Dur\u00e9e de lecture estim\u00e9e":"8 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/graphiste.com\/blog\/prototypo\/#article","isPartOf":{"@id":"https:\/\/graphiste.com\/blog\/prototypo\/"},"author":{"name":"Thomas Lazzaroni","@id":"https:\/\/graphiste.com\/blog\/#\/schema\/person\/cc3b0a678aeffcae19ecc599eaf679e5"},"headline":"Prototypo, cr\u00e9ez votre propre typographie sur-mesure en quelques clics","datePublished":"2016-03-22T14:23:31+00:00","mainEntityOfPage":{"@id":"https:\/\/graphiste.com\/blog\/prototypo\/"},"wordCount":1666,"commentCount":0,"publisher":{"@id":"https:\/\/graphiste.com\/blog\/#organization"},"image":{"@id":"https:\/\/graphiste.com\/blog\/prototypo\/#primaryimage"},"thumbnailUrl":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-1-1.jpg","articleSection":["Webdesign"],"inLanguage":"fr-FR","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/graphiste.com\/blog\/prototypo\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/graphiste.com\/blog\/prototypo\/","url":"https:\/\/graphiste.com\/blog\/prototypo\/","name":"Prototypo, cr\u00e9ez votre propre typographie","isPartOf":{"@id":"https:\/\/graphiste.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/graphiste.com\/blog\/prototypo\/#primaryimage"},"image":{"@id":"https:\/\/graphiste.com\/blog\/prototypo\/#primaryimage"},"thumbnailUrl":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-1-1.jpg","datePublished":"2016-03-22T14:23:31+00:00","description":"Prototypo est une application en ligne qui permet \u00e0 chacun de cr\u00e9er \u00e0 partir de 2 mod\u00e8les de base (un sans empattements + un avec) une typographie qui","breadcrumb":{"@id":"https:\/\/graphiste.com\/blog\/prototypo\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/graphiste.com\/blog\/prototypo\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/graphiste.com\/blog\/prototypo\/#primaryimage","url":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-1-1.jpg","contentUrl":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2016\/03\/prototypo-1-1.jpg","width":946,"height":719},{"@type":"BreadcrumbList","@id":"https:\/\/graphiste.com\/blog\/prototypo\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Blog","item":"https:\/\/graphiste.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Webdesign","item":"https:\/\/graphiste.com\/blog\/webdesign\/"},{"@type":"ListItem","position":3,"name":"Prototypo, cr\u00e9ez votre propre typographie sur-mesure en quelques clics"}]},{"@type":"WebSite","@id":"https:\/\/graphiste.com\/blog\/#website","url":"https:\/\/graphiste.com\/blog\/","name":"Graphiste.com","description":"graphiste","publisher":{"@id":"https:\/\/graphiste.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/graphiste.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Organization","@id":"https:\/\/graphiste.com\/blog\/#organization","name":"Graphiste.com","url":"https:\/\/graphiste.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/graphiste.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2022\/07\/logo-blog-graphiste.svg","contentUrl":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2022\/07\/logo-blog-graphiste.svg","width":1,"height":1,"caption":"Graphiste.com"},"image":{"@id":"https:\/\/graphiste.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/graphistesfreelances","https:\/\/x.com\/Graphistecom","https:\/\/www.linkedin.com\/company\/graphiste-com\/","https:\/\/fr.pinterest.com\/Graphiste_Com","https:\/\/www.instagram.com\/graphiste_com\/"]},{"@type":"Person","@id":"https:\/\/graphiste.com\/blog\/#\/schema\/person\/cc3b0a678aeffcae19ecc599eaf679e5","name":"Thomas Lazzaroni","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/graphiste.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/7306fb87b7017ab0955d07c2f2b771ac79e91965a2fca514df0c043f7c087fd2?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/7306fb87b7017ab0955d07c2f2b771ac79e91965a2fca514df0c043f7c087fd2?s=96&d=mm&r=g","caption":"Thomas Lazzaroni"},"description":"Depuis plus de 10 ans, je contribue \u00e0 faire rayonner nos sites en imaginant des strat\u00e9gies qui renforcent notre visibilit\u00e9 et notre position de r\u00e9f\u00e9rence.","sameAs":["https:\/\/www.linkedin.com\/in\/thomaslazzaroni\/","https:\/\/x.com\/totolazza"],"url":"https:\/\/graphiste.com\/blog\/author\/thomas\/"}]}},"_links":{"self":[{"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/posts\/980","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/comments?post=980"}],"version-history":[{"count":0,"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/posts\/980\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/media\/981"}],"wp:attachment":[{"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/media?parent=980"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/categories?post=980"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/tags?post=980"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}