{"id":250,"date":"2015-04-01T05:40:22","date_gmt":"2015-04-01T00:10:22","guid":{"rendered":"http:\/\/blog.azoora.com\/?p=250"},"modified":"2017-06-21T08:38:57","modified_gmt":"2017-06-21T08:38:57","slug":"ideal-fonts-for-wireframes-and-mockups","status":"publish","type":"post","link":"https:\/\/azoora.com\/blog\/fonts\/ideal-fonts-for-wireframes-and-mockups\/","title":{"rendered":"Ideal Fonts for Prototypes, Wireframes and Mock-ups"},"content":{"rendered":"<h2>Wireframes and Mockups<\/h2>\n<p>Even though starting with design without the content is a bad approach to web design, we have to accept that it is a common practice. Without content in place, Designers usually pick something from the existing website OR put some generic text OR most-commonly use the Latin script \u201c<a title=\"Lorem ipsum\" href=\"http:\/\/en.wikipedia.org\/wiki\/Lorem_ipsum\" target=\"_blank\" rel=\"nofollow noopener\"><span style=\"color: #1abc9c;\">Lorem Ipsum<\/span><\/a>.\u201d<\/p>\n<p>What happens is\u00a0&#8211; it\u2019s challenging to use series of words (that are not final or just dummy) and get the desired symmetry in say a block of text created in the visual mock-up.<\/p>\n<p>Someone thought of a solution! Thanks to <a title=\"Tom Arne Bakkemoen\" href=\"https:\/\/twitter.com\/bakkemoen\" target=\"_blank\" rel=\"nofollow noopener\"><span style=\"color: #1abc9c;\">Tom from Norway<\/span><\/a>, who designed a simple and crisp \u201cblocks\u201d based font particularly to use during <b>wireframes<\/b> and <b>mockups<\/b> stage. The font name is: <a title=\"BLOKK Font\" href=\"http:\/\/blokkfont.com\/\" target=\"_blank\" rel=\"nofollow noopener\"><span style=\"color: #1abc9c;\">BLOKK<\/span><\/a> and available for download as both TTF and Web <b>fonts<\/b>. Each character typed using this font, generates a rectangular glyph, which looks like a block of text seen from afar; also forcing the client to not focus on the text, only the design.<\/p>\n<p>High usability, Tom!<\/p>\n<p>It\u2019s very easy to control the start and end to allow the designer to quickly get away with the blocks of text and spend more time on design.<\/p>\n<p>Inspired by BLOKK font, Christian Naths created a open source project, where he developed another font. He gives Tom credit for his inspiration, and develops some \u201cscripted\u201d variants of blocks of text, that designers can use. Text that looks like text, not blocks, but something that\u2019s easier to do and control. The output still looks like a blurb watched from far off, which works as desired. His font name is <a title=\"Redacted Font\" href=\"https:\/\/github.com\/christiannaths\/Redacted-Font\" target=\"_blank\" rel=\"nofollow noopener\"><span style=\"color: #1abc9c;\">Redacted Font \u2013 available for download here<\/span><\/a> (you can view the examples before downloading).<\/p>\n<p>Interesting micro-innovations.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Wireframes and Mockups Even though starting with design without the content is a bad approach to web design, we have to accept that it is a common practice. Without content in place, Designers usually pick something from the existing website OR put some generic text OR most-commonly use the Latin script \u201cLorem Ipsum.\u201d What happens [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":251,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"spay_email":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false},"categories":[6],"tags":[27,39],"jetpack_featured_media_url":"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2015\/12\/Block.png","jetpack_publicize_connections":[],"jetpack_shortlink":"https:\/\/wp.me\/p7FQPL-42","jetpack-related-posts":[],"jetpack_sharing_enabled":true,"jetpack_likes_enabled":true,"_links":{"self":[{"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/posts\/250"}],"collection":[{"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/comments?post=250"}],"version-history":[{"count":1,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/posts\/250\/revisions"}],"predecessor-version":[{"id":618,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/posts\/250\/revisions\/618"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/media\/251"}],"wp:attachment":[{"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/media?parent=250"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/categories?post=250"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/tags?post=250"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}