{"id":695,"date":"2016-03-01T21:17:11","date_gmt":"2016-03-01T20:17:11","guid":{"rendered":"http:\/\/eboreal.com\/devblog\/?p=695"},"modified":"2017-02-12T22:28:14","modified_gmt":"2017-02-12T21:28:14","slug":"the-firewall-maquette-graphique","status":"publish","type":"post","link":"https:\/\/eboreal.com\/devblog\/the-firewall-maquette-graphique\/","title":{"rendered":"The Firewall : Maquette graphique"},"content":{"rendered":"<p>[et_pb_section admin_label=\u00a0\u00bbsection\u00a0\u00bb]<br \/>\n[et_pb_row admin_label=\u00a0\u00bbrow\u00a0\u00bb]<br \/>\n[et_pb_column type=\u00a0\u00bb4_4&Prime;]<br \/>\n[et_pb_text admin_label=\u00a0\u00bbText\u00a0\u00bb]<\/p>\n<h2>Appareils support\u00e9s<\/h2>\n<p>Le jeu tournera exclusivement sur Apple iOS.<\/p>\n<h2>Orientation<\/h2>\n<p>Le jeu se jouera en mode portrait seulement.<\/p>\n<h2>Emplacement sur l&rsquo;\u00e9cran<\/h2>\n<p>Sur iOS il y a 2 types de format d&rsquo;\u00e9cran :<\/p>\n<ul>\n<li>Les iPhones : 16\/9 (le ratio est identique pour tous les iPhones \u00e0 partir du 5)<\/li>\n<li>Les iPads : 4\/3 (le ratio est identique pour tous les iPads y compris le dernier iPad Pro)<\/li>\n<\/ul>\n<p>Ce qui donne si on les superpose :<\/p>\n<p><a href=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/iPhone-iPad.jpg\" rel=\"attachment wp-att-699\" data-rel=\"lightbox-gallery-l7UTxe3V\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-699\" src=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/iPhone-iPad-169x300.jpg\" alt=\"iPhone-iPad\" width=\"350\" height=\"622\" srcset=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/iPhone-iPad-169x300.jpg 169w, https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/iPhone-iPad.jpg 500w\" sizes=\"(max-width: 350px) 100vw, 350px\" \/><\/a>Le but sera de pr\u00e9senter un \u00e9cran coh\u00e9rent aussi bien sur un iPhone que sur un iPad.<\/p>\n<h2>iPad<\/h2>\n<p>Sur l&rsquo;iPad l&rsquo;\u00e9cran sera d\u00e9compos\u00e9 en 3 parties :<\/p>\n<ol>\n<li>Titre plus publicit\u00e9 superpos\u00e9s (la publicit\u00e9 cache le titre quand elle est disponible)<\/li>\n<li>\u00ab\u00a0Terrain\u00a0\u00bb de jeu principal o\u00f9 se d\u00e9roulera l&rsquo;action<\/li>\n<li>Bandeau \u00ab\u00a0outils\u00a0\u00bb<\/li>\n<\/ol>\n<p><a href=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/iPad-screen.jpg\" rel=\"attachment wp-att-700\" data-rel=\"lightbox-gallery-l7UTxe3V\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-700\" src=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/iPad-screen.jpg\" alt=\"iPad-screen\" width=\"350\" height=\"622\" srcset=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/iPad-screen.jpg 500w, https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/iPad-screen-169x300.jpg 169w\" sizes=\"(max-width: 350px) 100vw, 350px\" \/><\/a><\/p>\n<h2>iPhone<\/h2>\n<p>Sur l&rsquo;iPhone l&rsquo;\u00e9cran sera d\u00e9compos\u00e9 en 4 parties :<\/p>\n<ol>\n<li>Publicit\u00e9<\/li>\n<li>Titre<\/li>\n<li>\u00ab\u00a0Terrain\u00a0\u00bb de jeu principal<\/li>\n<li>Bandeau \u00ab\u00a0outils\u00a0\u00bb<\/li>\n<\/ol>\n<p>Il y a deux changements majeurs : la publicit\u00e9 ne recouvre pas le titre et le bandeau outils voit sa hauteur doubler pour tenir compte de la faible largeur des iPhones.<\/p>\n<h2><a href=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/iPhone-screen.jpg\" rel=\"attachment wp-att-704\" data-rel=\"lightbox-gallery-l7UTxe3V\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-704\" src=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/iPhone-screen.jpg\" alt=\"iPhone-screen\" width=\"350\" height=\"622\" srcset=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/iPhone-screen.jpg 500w, https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/iPhone-screen-169x300.jpg 169w\" sizes=\"(max-width: 350px) 100vw, 350px\" \/><\/a>Terrain de jeu<\/h2>\n<p>Le terrain de jeu sera compos\u00e9 d&rsquo;une grille 10&#215;10 dans laquelle le joueur viendra poser des \u00e9l\u00e9ments de d\u00e9fense et dessiner les liaisons entre les diff\u00e9rents \u00e9l\u00e9ments.<\/p>\n<p><a href=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/the-firewall-03.jpg\" rel=\"attachment wp-att-705\" data-rel=\"lightbox-gallery-l7UTxe3V\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-705 aligncenter\" src=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/the-firewall-03.jpg\" alt=\"the firewall 03\" width=\"350\" height=\"378\" srcset=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/the-firewall-03.jpg 350w, https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/the-firewall-03-278x300.jpg 278w\" sizes=\"(max-width: 350px) 100vw, 350px\" \/><\/a>Les messages arriveront par le haut et les serveurs seront en bas.<\/p>\n<h2>Le bandeau d&rsquo;outils<\/h2>\n<p>Pour le bandeau d&rsquo;outils je n&rsquo;ai pas encore d&rsquo;id\u00e9es pr\u00e9cises mais cela devrait ressembler \u00e0 \u00e7a (dans l&rsquo;id\u00e9e) :<\/p>\n<h2><a href=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/outils.jpg\" rel=\"attachment wp-att-707\" data-rel=\"lightbox-gallery-l7UTxe3V\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-707\" src=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/outils.jpg\" alt=\"outils\" width=\"398\" height=\"93\" srcset=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/outils.jpg 1216w, https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/outils-300x70.jpg 300w, https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/outils-768x179.jpg 768w, https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/outils-1024x239.jpg 1024w, https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/outils-1080x252.jpg 1080w\" sizes=\"(max-width: 398px) 100vw, 398px\" \/><\/a>Dessins pr\u00e9paratoires<\/h2>\n<p>Voila en prime quelques dessins pr\u00e9paratoires que j&rsquo;ai fait en amont du projet pour visualiser le jeu :<\/p>\n<p><a href=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-05.jpg\" rel=\"attachment wp-att-710\" data-rel=\"lightbox-gallery-l7UTxe3V\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-710 aligncenter\" src=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-05.jpg\" alt=\"The firewall-draw 05\" width=\"366\" height=\"601\" srcset=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-05.jpg 366w, https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-05-183x300.jpg 183w\" sizes=\"(max-width: 366px) 100vw, 366px\" \/><\/a><\/p>\n<p><a href=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-04.jpg\" rel=\"attachment wp-att-711\" data-rel=\"lightbox-gallery-l7UTxe3V\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-711 aligncenter\" src=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-04.jpg\" alt=\"The firewall-draw 04\" width=\"683\" height=\"924\" srcset=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-04.jpg 683w, https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-04-222x300.jpg 222w\" sizes=\"(max-width: 683px) 100vw, 683px\" \/><\/a><\/p>\n<p><a href=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-01.jpg\" rel=\"attachment wp-att-712\" data-rel=\"lightbox-gallery-l7UTxe3V\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-712 aligncenter\" src=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-01.jpg\" alt=\"The firewall-draw 01\" width=\"500\" height=\"375\" srcset=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-01.jpg 500w, https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-01-300x225.jpg 300w\" sizes=\"(max-width: 500px) 100vw, 500px\" \/><\/a><\/p>\n<p><a href=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-02.jpg\" rel=\"attachment wp-att-713\" data-rel=\"lightbox-gallery-l7UTxe3V\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-713 aligncenter\" src=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-02.jpg\" alt=\"The firewall-draw 02\" width=\"500\" height=\"476\" srcset=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-02.jpg 500w, https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-02-300x286.jpg 300w\" sizes=\"(max-width: 500px) 100vw, 500px\" \/><\/a><\/p>\n<p><a href=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-03.jpg\" rel=\"attachment wp-att-714\" data-rel=\"lightbox-gallery-l7UTxe3V\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-714 aligncenter\" src=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-03.jpg\" alt=\"The firewall-draw 03\" width=\"500\" height=\"655\" srcset=\"https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-03.jpg 500w, https:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-03-229x300.jpg 229w\" sizes=\"(max-width: 500px) 100vw, 500px\" \/><\/a><br \/>\n[\/et_pb_text]<br \/>\n[\/et_pb_column]<br \/>\n[\/et_pb_row]<br \/>\n[\/et_pb_section]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Appareils support\u00e9s Le jeu tournera exclusivement sur Apple iOS. Orientation Le jeu se jouera en mode portrait seulement. Emplacement sur l&rsquo;\u00e9cran Sur iOS il y a 2 types de format d&rsquo;\u00e9cran : Les iPhones : 16\/9 (le ratio est identique pour tous les iPhones \u00e0 partir du 5) Les iPads : 4\/3 (le ratio est [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":711,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"<h2>Appareils support\u00e9s<\/h2>\r\nLe jeu tournera exclusivement sur Apple iOS.\r\n<h2>Orientation<\/h2>\r\nLe jeu se jouera en mode portrait seulement.\r\n<h2>Emplacement sur l'\u00e9cran<\/h2>\r\nSur iOS il y a 2 types de format d'\u00e9cran :\r\n<ul>\r\n \t<li>Les iPhones : 16\/9 (le ratio est identique pour tous les iPhones \u00e0 partir du 5)<\/li>\r\n \t<li>Les iPads : 4\/3 (le ratio est identique pour tous les iPads y compris le dernier iPad Pro)<\/li>\r\n<\/ul>\r\nCe qui donne si on les superpose :\r\n\r\n<a href=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/iPhone-iPad.jpg\" rel=\"attachment wp-att-699\"><img class=\"aligncenter wp-image-699\" src=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/iPhone-iPad-169x300.jpg\" alt=\"iPhone-iPad\" width=\"350\" height=\"622\" \/><\/a>Le but sera de pr\u00e9senter un \u00e9cran coh\u00e9rent aussi bien sur un iPhone que sur un iPad.\r\n<h2>iPad<\/h2>\r\nSur l'iPad l'\u00e9cran sera d\u00e9compos\u00e9 en 3 parties :\r\n<ol>\r\n \t<li>Titre plus publicit\u00e9 superpos\u00e9s (la publicit\u00e9 cache le titre quand elle est disponible)<\/li>\r\n \t<li>\"Terrain\" de jeu principal o\u00f9 se d\u00e9roulera l'action<\/li>\r\n \t<li>Bandeau \"outils\"<\/li>\r\n<\/ol>\r\n<a href=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/iPad-screen.jpg\" rel=\"attachment wp-att-700\"><img class=\"aligncenter wp-image-700\" src=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/iPad-screen.jpg\" alt=\"iPad-screen\" width=\"350\" height=\"622\" \/><\/a>\r\n<h2>iPhone<\/h2>\r\nSur l'iPhone l'\u00e9cran sera d\u00e9compos\u00e9 en 4 parties :\r\n<ol>\r\n \t<li>Publicit\u00e9<\/li>\r\n \t<li>Titre<\/li>\r\n \t<li>\"Terrain\" de jeu principal<\/li>\r\n \t<li>Bandeau \"outils\"<\/li>\r\n<\/ol>\r\nIl y a deux changements majeurs : la publicit\u00e9 ne recouvre pas le titre et le bandeau outils voit sa hauteur doubler pour tenir compte de la faible largeur des iPhones.\r\n<h2><a href=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/iPhone-screen.jpg\" rel=\"attachment wp-att-704\"><img class=\"aligncenter wp-image-704\" src=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/iPhone-screen.jpg\" alt=\"iPhone-screen\" width=\"350\" height=\"622\" \/><\/a>Terrain de jeu<\/h2>\r\nLe terrain de jeu sera compos\u00e9 d'une grille 10x10 dans laquelle le joueur viendra poser des \u00e9l\u00e9ments de d\u00e9fense et dessiner les liaisons entre les diff\u00e9rents \u00e9l\u00e9ments.\r\n\r\n<a href=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/the-firewall-03.jpg\" rel=\"attachment wp-att-705\"><img class=\"size-full wp-image-705 aligncenter\" src=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/the-firewall-03.jpg\" alt=\"the firewall 03\" width=\"350\" height=\"378\" \/><\/a>Les messages arriveront par le haut et les serveurs seront en bas.\r\n<h2>Le bandeau d'outils<\/h2>\r\nPour le bandeau d'outils je n'ai pas encore d'id\u00e9es pr\u00e9cises mais cela devrait ressembler \u00e0 \u00e7a (dans l'id\u00e9e) :\r\n<h2><a href=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/outils.jpg\" rel=\"attachment wp-att-707\"><img class=\"aligncenter wp-image-707\" src=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/outils.jpg\" alt=\"outils\" width=\"398\" height=\"93\" \/><\/a>Dessins pr\u00e9paratoires<\/h2>\r\nVoila en prime quelques dessins pr\u00e9paratoires que j'ai fait en amont du projet pour visualiser le jeu :\r\n\r\n<a href=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-05.jpg\" rel=\"attachment wp-att-710\"><img class=\"size-full wp-image-710 aligncenter\" src=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-05.jpg\" alt=\"The firewall-draw 05\" width=\"366\" height=\"601\" \/><\/a>\r\n\r\n<a href=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-04.jpg\" rel=\"attachment wp-att-711\"><img class=\"size-full wp-image-711 aligncenter\" src=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-04.jpg\" alt=\"The firewall-draw 04\" width=\"683\" height=\"924\" \/><\/a>\r\n\r\n<a href=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-01.jpg\" rel=\"attachment wp-att-712\"><img class=\"size-full wp-image-712 aligncenter\" src=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-01.jpg\" alt=\"The firewall-draw 01\" width=\"500\" height=\"375\" \/><\/a>\r\n\r\n<a href=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-02.jpg\" rel=\"attachment wp-att-713\"><img class=\"size-full wp-image-713 aligncenter\" src=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-02.jpg\" alt=\"The firewall-draw 02\" width=\"500\" height=\"476\" \/><\/a>\r\n\r\n<a href=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-03.jpg\" rel=\"attachment wp-att-714\"><img class=\"size-full wp-image-714 aligncenter\" src=\"http:\/\/eboreal.com\/devblog\/wp-content\/uploads\/2016\/03\/The-firewall-draw-03.jpg\" alt=\"The firewall-draw 03\" width=\"500\" height=\"655\" \/><\/a>","_et_gb_content_width":"","footnotes":""},"categories":[3,4,15],"tags":[16],"class_list":["post-695","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-a-la-une","category-blog","category-firewall-defense","tag-design","et-has-post-format-content","et_post_format-et-post-format-standard"],"_links":{"self":[{"href":"https:\/\/eboreal.com\/devblog\/wp-json\/wp\/v2\/posts\/695","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/eboreal.com\/devblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/eboreal.com\/devblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/eboreal.com\/devblog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/eboreal.com\/devblog\/wp-json\/wp\/v2\/comments?post=695"}],"version-history":[{"count":9,"href":"https:\/\/eboreal.com\/devblog\/wp-json\/wp\/v2\/posts\/695\/revisions"}],"predecessor-version":[{"id":3345,"href":"https:\/\/eboreal.com\/devblog\/wp-json\/wp\/v2\/posts\/695\/revisions\/3345"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/eboreal.com\/devblog\/wp-json\/wp\/v2\/media\/711"}],"wp:attachment":[{"href":"https:\/\/eboreal.com\/devblog\/wp-json\/wp\/v2\/media?parent=695"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/eboreal.com\/devblog\/wp-json\/wp\/v2\/categories?post=695"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/eboreal.com\/devblog\/wp-json\/wp\/v2\/tags?post=695"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}