[{"data":1,"prerenderedAt":115},["ShallowReactive",2],{"article:morets-development-of-tool-for-building-web-responsive-typographic-systems":3},{"success":4,"article":5,"request":112},true,{"parent":6,"langs":7,"_id":10,"contributors":11,"typeData":20,"data":101,"slugs":110,"slug":111},"308f2508-39ad-43fe-a49b-3483ee224f04",[8,9],"primary","secondary","0e05b1b0-3baf-4c4e-b070-3386a18392ae",[12,16],{"lastName":13,"name":14,"_id":15},"Targino","Mateus","36182a39-0c9a-4ddc-8016-d27c59d34d58",{"lastName":17,"name":18,"_id":19},"Novais","Carlos","c56ec853-642c-4adb-8b00-addbc428eac9",{"startPage":21,"references":22,"endPage":98,"track":99,"has_file":4,"doi":100},2446,[23,26,29,32,35,38,41,44,47,50,53,56,59,62,65,68,71,74,77,80,83,86,89,92,95],{"id":24,"label":25},"c65cf6a7-ffa7-4645-ba9d-c3faaff3c5a1","\u003Cp>GITHUB. Hello World. Github, 2022. Disponível em \u003Chttps://docs.github.com/en/get-started/quickstart/hello-world>. Acesso em 30/01/2022.\u003C/p>",{"id":27,"label":28},"64347877-3304-4f4c-8006-0387a5390337","\u003Cp>GITHUB. \u003Cstrong>What is Gulp\u003C/strong>. Github, 2019. Disponível em \u003Chttps://github.com/gulpjs/gulp>. Acesso em 30/01/2022.\u003C/p>",{"id":30,"label":31},"bc814be0-4a50-4e08-bfe2-f1bd13e28bc2","\u003Cp>GONZALEZ, R. \u003Cstrong>Figma Wants Designers to Collaborate Google-Docs Style\u003C/strong>. Wired, 2017. Disponível em \u003Chttps://github.com/gulpjs/gulp>. Acesso em 30/01/2022.\u003C/p>",{"id":33,"label":34},"5294ce8b-be44-4d41-aae7-1472404dc85d","\u003Cp>GOOGLE. \u003Cstrong>Material Design\u003C/strong>. Introduction, 2018. Disponível em \u003Chttps://material.io/design/introduction>. Acesso em 30/01/2022.\u003C/p>",{"id":36,"label":37},"32d7ddd2-bcdd-444f-9396-160207d1c58a","\u003Cp>GOOGLE. \u003Cstrong>Google Open Source Blog\u003C/strong>. Introducing OpenType Font Variations, 2016. Disponível em \u003Chttps://opensource.googleblog.com/2016/09/introducing-opentype-font-variations.html>. Acesso em 30/01/2022.\u003C/p>",{"id":39,"label":40},"b82cc84b-768d-4045-b6cf-2e13eba25c95","\u003Cp>GRAHAM, G. \u003Cstrong>CSS Tricks\u003C/strong>. Fluid Typography, 2019. Disponível em \u003Chttps://css-tricks.com/snippets/css/fluid-typography/>. Acesso em 30/01/2022.\u003C/p>",{"id":42,"label":43},"a8feaeae-a21e-42d3-bc3b-402b55b60397","\u003Cp>KELLUM, S. \u003Cstrong>CSS Tricks\u003C/strong>. Intrinsic Typography is the Future of Styling Text on the Web, 2021. Disponível em \u003Chttps://css-tricks.com/intrinsic-typography-is-the-future-of-styling-text-on-the-web/>. Acesso em 30/01/2022.\u003C/p>",{"id":45,"label":46},"bc8dc706-b67c-4f3b-b704-e92ef9689b54","\u003Cp>HIBBARD, J. \u003Cstrong>Sitepoint\u003C/strong>. A Guide to the Pug HTML Template Preprocessor, 2019. Disponível em \u003Chttps://www.sitepoint.com/a-beginners-guide-to-pug/>. Acesso em 30/01/2022.\u003C/p>",{"id":48,"label":49},"838caf68-29b1-47be-b2e1-56ed4460e131","\u003Cp>Junior, M.; FREITAS, R.; PERES, S.; FANTINATO, M.; STEINBECK, R.; ARAÚJO, U. Experimenting with design thinking in requirements refinement for a learning management system. In: \u003Cstrong>Simpósio Brasileiro de Sistemas de Informação\u003C/strong>. João Pessoa, 2013.\u003C/p>",{"id":51,"label":52},"c16ae8c8-5d89-4481-8b3a-f75787a53d9e","\u003Cp>LIIKKANEN, L. A.; LAAKSO, M.; BJÖRKLUND, T. Foundations for studying creative design practices. In: \u003Cstrong>Procedings of the Second Conference on Creativity and Innovation in Design\u003C/strong>. ACM, New York, NY, USA 2011. p.309–315.\u003C/p>",{"id":54,"label":55},"e3c6c27c-ccfc-40fa-8ba0-86698ac3187b","\u003Cp>LUPTON, E. \u003Cstrong>Pensando com tipos: Guia para designers, escritores e estudantes\u003C/strong>. 1ed. - Editora Gustavo Gili, 2020.\u003C/p>",{"id":57,"label":58},"3d186fca-c668-4bfc-82f4-2425e28e6a1c","\u003Cp>MOZILLA. \u003Cstrong>MDN Web Docs Mozilla\u003C/strong>. The Web Open Font Format(WOFF), 2022. Disponível em \u003Chttps://css-tricks.com/intrinsic-typography-is-the-future-of-styling-text-on-the-web/>. Acesso em 30/01/2022.\u003C/p>",{"id":60,"label":61},"1792f1f8-366f-41a0-8786-eb2e1e92759d","\u003Cp>NETLIFY. \u003Cstrong>Netlify\u003C/strong>. About Netflify, 2022. Disponível em \u003Chttps://css-tricks.com/intrinsic-typography-is-the-future-of-styling-text-on-the-web/>. Acesso em 30/01/2022.\u003C/p>",{"id":63,"label":64},"0e0c676e-7b14-4ee2-b729-0a413d961f3f","\u003Cp>PAMENTAL, J. \u003Cstrong>Responsive Typography: Using Type Well on the Web\u003C/strong>. 1ed. - O'Reilly Media, Sebastopol, 2014.\u003C/p>",{"id":66,"label":67},"d680b02a-3c11-4b58-8578-150b0f2c3645","\u003Cp>PIOVESAN, A.; TEMPORINI, R. Pesquisa exploratória: procedimento metodológico para o estudo de fatores humanos no campo da saúde pública. \u003Cstrong>Scielo Public Health\u003C/strong>, 1995. Disponível em \u003Chttp://www.scielosp.org/scielo.php?pid=S0034-89101995000400010&script=sci_arttext&tlng=>. Acesso em 30/01/2022.\u003C/p>",{"id":69,"label":70},"63606a70-1fbe-429f-9fdc-f16484fa0182","\u003Cp>TSCHIHOLD, J. \u003Cstrong>The Form of the Book: Essays on the Morality of Good Design\u003C/strong>. - Hartley & Marks, Vancouver, 1991.\u003C/p>",{"id":72,"label":73},"fc3a57de-3844-455d-8f22-1387fe783064","\u003Cp>TSCHIMMEL, K. Design thinking as an effective toolkit for innovation. In: \u003Cstrong>Proceedings of the ISPIM Conference: Action for Innovation from Experience\u003C/strong>. Barcelona 2012. p.1–20.\u003C/p>",{"id":75,"label":76},"981b68f2-8a99-48c9-adac-81444baf7a42","\u003Cp>VICTIONARY. \u003Cstrong>On the road to variable: flexible future of typography\u003C/strong>. - Two Points, Hong Kong, 1991.\u003C/p>",{"id":78,"label":79},"5158c0ed-6e1e-4a76-a908-3dbcb9fd6aaf","\u003Cp>W3SCHOOLS. \u003Cstrong>W3Schools\u003C/strong>. CSS Web Fonts, 2022. Disponível em \u003Chttps://www.w3schools.com/css/css3_fonts.asp>. Acesso em 30/01/2022.\u003C/p>",{"id":81,"label":82},"a54285e1-fddf-4ec9-a9dc-44322f81a646","\u003Cp>MOZILLA. \u003Cstrong>MDN Web Docs\u003C/strong>. CSS, 2021. Disponível em \u003Chttps://developer.mozilla.org/pt-BR/docs/Web/CSS>. Acesso em 30/01/2022.\u003C/p>",{"id":84,"label":85},"eecfe4a6-e8e3-4ae4-ad3f-8131baea2b12","\u003Cp>MOZILLA. \u003Cstrong>MDN Web Docs\u003C/strong>. HTML: Linguagem de Marcação de Hipertexto, 2021. Disponível em \u003Chttps://developer.mozilla.org/pt-BR/docs/Web/HTML>. Acesso em 30/01/2022.\u003C/p>",{"id":87,"label":88},"d9519f85-cceb-40d7-a684-337127ba044b","\u003Cp>MOZILLA. \u003Cstrong>MDN Web Docs\u003C/strong>. Javascript, 2021. Disponível em \u003Chttps://developer.mozilla.org/pt-BR/docs/Web/JavaScript>. Acesso em 30/01/2022.\u003C/p>",{"id":90,"label":91},"e79521d4-d835-46b7-b513-7c9a275997a9","\u003Cp>MOZILLA. \u003Cstrong>MDN Web Docs\u003C/strong>. Node.js, 2021. Disponível em \u003Chttps://developer.mozilla.org/pt-BR/docs/Glossary/Node.js>. Acesso em 30/01/2022.\u003C/p>",{"id":93,"label":94},"1f168928-9e7a-4eaa-bc08-039295dec7e7","\u003Cp>WITHROW, J. \u003Cstrong>Boxes and Arrows\u003C/strong>. Competitive Analysis: Understanding the Market Context, 2006. Disponível em \u003Chttps://boxesandarrows.com/competitive-analysis-understanding-the-market-context/>. Acesso em 30/01/2022.\u003C/p>",{"id":96,"label":97},"056486a3-70b4-4018-bc0a-6f713a312bbf","\u003Cp>WOLOSZYN, M.; MEÜRER, M.; GONÇALVES, B. S. Fontes variáveis: um estudo prospectivo. In: \u003Cstrong>Anais do 9º CIDI e 9º CONGIC\u003C/strong>. 14 Folhas. Sociedade Brasileira de Design da Informação – SBDI, 2019.\u003C/p>",2467,"lx1qad3","10.5151/ped2022-2169916",{"primary":102,"secondary":106},{"keywords":103,"excerpt":104,"title":105},"\u003Cp>Tipografia, Web Design Responsivo, Design de interfaces, Design editorial, Fontes Variáveis\u003C/p>","O uso de sistemas tipográficos na criação de interfaces digitais é uma prática comum e recomendada. Se tratando de websites, há uma preocupação recorrente em manter os layouts confortáveis e consistentes para diferentes tamanhos de tela considerando a variedade de dispositivos presentes no mercado. Um dos principais desafios neste contexto são as mudanças feitas em características dos textos presentes nestes ambientes. Aliado a isso, nos últimos tempos, as fontes variáveis vêm ganhando cada vez mais destaque e visibilidade por parte dos estudiosos e entusiastas de design e tipografia por suas potencialidades. Diante disto, este trabalho apresenta o processo de pesquisa e desenvolvimento de uma solução que visa criar sistemas tipográficos web responsivos. Para tanto, a ferramenta aqui proposta se inspira em cânones do design com tipos, utiliza de técnicas de desenvolvimento web e as possibilidades das variable fonts, permitindo que os usuários criem sistemas type systems fluidos e customizáveis com comportamento responsivo.","Morets: Desenvolvimento de uma Ferramenta para Construção de Sistemas Tipográficos Web Responsivos",{"keywords":107,"excerpt":108,"title":109},"\u003Cp>Typography, Responsive Web Design, User Interface Design, Book Design, Variable fonts\u003C/p>","The use of typographic systems while creating digital interfaces is a common and recommended practice. When it comes to websites, there is a recurring concern to keep layouts comfortable and consistent for different screen sizes considering the variety of devices on the market. One of the main challenges in this context are the changes in the characteristics of the text","Morets: Development of Tool for Building Web Responsive Typographic Systems",[111],"morets-development-of-tool-for-building-web-responsive-typographic-systems",{"target":113,"query":114},"articles/get",{"slug":111},1780316005564]