{"id":3669,"date":"2020-05-23T04:33:04","date_gmt":"2020-05-23T11:33:04","guid":{"rendered":"https:\/\/fontstruct.com\/news\/?p=3669"},"modified":"2020-05-29T00:09:51","modified_gmt":"2020-05-29T07:09:51","slug":"vertical-metrics-improved-touch-support-and-more","status":"publish","type":"post","link":"https:\/\/fontstruct.com\/news\/2020\/05\/23\/vertical-metrics-improved-touch-support-and-more\/","title":{"rendered":"Vertical Metrics, Improved Touch Support and More"},"content":{"rendered":"\n<p>As promised, today we\u2019re introducing a series of new features, enhancements and bug fixes to FontStruct.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Line Height Control (Vertical Metrics)<\/h2>\n\n\n\n<p>Until now, FontStruct has automatically calculated the overall line-height and line-spacing for each downloaded font. This is usually fine, but every now and again people request manual control over these values.<\/p>\n\n\n\n<p>Today we\u2019re giving FontStructors this option. To use it, first select \u201cView\u201d and then \u201cLine Height\u201d from the menu (You need to be in Expert Mode):<\/p>\n\n\n\n<p><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"731\" src=\"https:\/\/fontstruct.com\/news\/wp-content\/uploads\/2020\/05\/select-line-height-1024x731.png\" alt=\"Select Line Height in FontStructor\" class=\"wp-image-3673\"\/><figcaption>\u2013 Select Line Height from the Menu in Expert Mode<\/figcaption><\/figure>\n\n\n\n<p>Two new lines labelled \u201ctop\u201d and \u201cbottom\u201d appear on the canvas. You can simply drag these lines to specify a height for the font. The lines snap to 1\/8 of a grid square when dragged and dropped and you can click on the little reset button to go back to the default, automatic calculation. <\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"649\" src=\"https:\/\/fontstruct.com\/news\/wp-content\/uploads\/2020\/05\/vertical-metrics-adjustment-1024x649.png\" alt=\"Adjust and Reset the Line Height Guidelines\" class=\"wp-image-3676\"\/><figcaption>\u2013 Adjust and Reset the Line Height lines.<\/figcaption><\/figure>\n\n\n\n<p>The values which you specify like this will be stored in your downloaded font file. In accordance with the first law of FontStruct \u2013 <em>thou shalt not make things unnecessarily complicated<\/em> \u2013 that\u2019s all there is to it!<\/p>\n\n\n\n<p>Please note that a lot of desktop software will still ignore or mangle whatever vertical metrics values are stored in a font file. So you may not always achieve the precise desired effect. For anyone interested, some souls braver than I have <a rel=\"noreferrer noopener\" href=\"https:\/\/glyphsapp.com\/tutorials\/vertical-metrics\" target=\"_blank\">researched and documented<\/a> the history of this mess <a rel=\"noreferrer noopener\" href=\"https:\/\/www.kltf.de\/downloads\/FontMetrics-kltf.pdf\" target=\"_blank\">elsewhere<\/a>. <\/p>\n\n\n\n<p>Anyway, I think FontStruct\u2019s new feature will suffice to solve many line height problems, and you will find that some desktop software (<a rel=\"noreferrer noopener\" href=\"https:\/\/glyphsapp.com\/\" target=\"_blank\">Glyphs<\/a> for example) will indeed respect your placement of the new lines.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Improved PhoneStructor (Touch Support in the Editor)<\/h2>\n\n\n\n<p><iframe src=\"https:\/\/player.vimeo.com\/video\/421642773\" style=\"height: 75vh; width: auto; max-width: 100%; margin: auto; display: block\" frameborder=\"0\" allow=\"autoplay; fullscreen\" allowfullscreen=\"\"><\/iframe>\n<\/p>\n\n\n\n<p>The FontStructor editor and the FontStruct website have been kind of usable on phones and tablets for quite a while now, but in reality, FontStructing on a touch devices has hitherto been cumbersome and impracticable. <\/p>\n\n\n\n<p>With today\u2019s update, we\u2019re adding a series of interface optimisations to significantly improve FontStructing for users of touch devices and small displays, including \u2026<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">1. Finally, a tap-friendly Menu!<\/h3>\n\n\n\n<p>The dropdown menu, which simply didn\u2019t work on touch devices, now does. Note that the \u201cExpert Mode\u201d toggle now appears as part of this menu on small displays.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">2. The Toolbar is docked and augmented<\/h3>\n\n\n\n<p>To keep it out of the way whilst drawing, the toolbar is now automatically docked to the top of the screen. Some commonly used actions (undo, redo and fullscreen) have also been added for ease of access. Note that the docked toolbar only appears on very small screens (phones in portrait mode), tablets are unaffected.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">3. Improved Zoom<\/h3>\n\n\n\n<p>Pinch-to-zoom is now possible, making the zoom palette superfluous and so freeing up valuable screen space for drawing.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">4. Brick Palette Toggle<\/h3>\n\n\n\n<p>The brick palette (My Bricks and All Bricks) can now be toggled with a single tap. This gives you swift access to your bricks while also freeing up more screen space for drawing.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">5. Character Selector also works!<\/h3>\n\n\n\n<p>Something else which didn\u2019t work properly on touch devices until now was the scroll functionality on the character selector. It does now. We\u2019ve made the arrow buttons and the letter selectors themselves a bit bigger to suit your fingertips, and you can even swipe along the list of characters to scroll through them.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Miscellaneous Fixes and Improvements<\/h2>\n\n\n\n<p>In addition to Vertical Metrics controls and improved touch support we\u2019ve also made a number of diverse tweaks to the site and the editor.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">1. Spontaneous Brick Swap Fix<\/h3>\n\n\n\n<p>This will be familiar to some of you as the worst bug in FontStruct: You save your work, then after reloading it the following day, you find that \u201cgremlins\u201d have swapped out some of your bricks overnight and your design is corrupted. <\/p>\n\n\n\n<p>\u2013 This has proved a very difficult bug to reproduce and fix, but we are introducing a change today which hopefully will improve matters. Fingers crossed!<\/p>\n\n\n\n<p>If anyone does experience this problem again in the future, <a rel=\"noreferrer noopener\" href=\"https:\/\/fontstruct.com\/contact\" target=\"_blank\">please let us know<\/a>, <em>especially<\/em> if you can provide us with detailed steps to reproduce the problem.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">2. Cyrillic in the Widget<\/h3>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"579\" src=\"https:\/\/fontstruct.com\/news\/wp-content\/uploads\/2020\/05\/cyrillic-in-widget-1024x579.png\" alt=\"FontStruct Cyrillic Preview in Widget\" class=\"wp-image-3705\"\/><\/figure>\n\n\n\n<p>Recently, more FontStructors have been adding Cyrillic letters to their fonts or making purely Cyrillic designs. We\u2019ve added a Cyrillic preview option to the widget to support this trend. Suggestions for a better Cyrillic sample text are welcome.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">3. Links in descriptions<\/h3>\n\n\n\n<p>The editor for writing FontStruction descriptions was broken, making it impossible to add proper links in descriptions. That should be fixed now.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">4. Comment Removal<\/h3>\n\n\n\n<p>You can now remove your own comments for up to one hour after you have  made them.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">5. Improvements to Glyphs Export<\/h3>\n\n\n\n<p>We\u2019ve made a few improvements to the Glyphs Export functionality. <\/p>\n\n\n\n<p>Firstly, we updated the export to work with the latest version of Glyphs. <\/p>\n\n\n\n<p>Secondly we added the FontStruct grid in every export, so you can now continue to reference the same grid in Glyphs.<\/p>\n\n\n\n<p>Thirdly we have made the export behave differently when you are exporting a \u201cpure\u201d pixel font (i.e. one consisting only of pixel bricks and without any filters). When you export a pixel font like this, the exported file will be compatible with the official Glyphs Pixel font plugin, which is actually pretty cool. Now you can move seamlessly from working in FontStruct to working in Glyphs. Thanks to <a href=\"https:\/\/twitter.com\/gingerbeardman\">@gingerbreadman<\/a> and <a href=\"https:\/\/twitter.com\/glyphsapp\">@glyphsapp<\/a> for encouraging and helping us <a rel=\"noreferrer noopener\" href=\"https:\/\/github.com\/schriftgestalt\/BDFFileFormat\/issues\/1\" target=\"_blank\">get this one done<\/a>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">6. Removal of the \u201cContribute to Google Fonts\u201d Button.<\/h3>\n\n\n\n<p>We love <a href=\"https:\/\/fonts.google.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">Google Fonts<\/a> and have benefited greatly from their support in recent years, but we\u2019ve decided to remove this button from the site.<\/p>\n\n\n\n<p>Unfortunately there were technical issues with keeping the functionality working consistently at our end, and overall it did not seem that this form of submission was working very well.<\/p>\n\n\n\n<p>We continue to encourage designers whose work fulfils the Google Font criteria to submit their work for consideration to them, and we will keep the OFL license option (this is the principal requisite license for Google Fonts) as a permanent part of FontStruct.<\/p>\n\n\n\n<p>Future submissions of FontStructions to <a rel=\"noreferrer noopener\" href=\"https:\/\/fonts.google.com\/\" target=\"_blank\">Google Fonts<\/a> will have to be made manually and independently of FontStruct.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">7. Grid-coordinate Display<\/h3>\n\n\n\n<p>This is an experimental one. If you are in \u201cExpert Mode\u201d you will now see the current grid coordinates in the bottom right hand corner of the screen.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">8. \u201cDesert rescue\u201d feature<\/h3>\n\n\n\n<p>Every now and again someone gets in touch having somehow panned off into the unmapped farther reaches of the grid. They\u2019ve lost all orientation and have no idea where the baseline or origin is. <\/p>\n\n\n\n<p>Clearing the browser cache was the old advice here, but now <em>much<\/em> more conveniently, you can simply double click or double tap on the \u201chand\u201d&nbsp;panning tool to return the grid to its default position and find your way home.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">That\u2019s It!<\/h2>\n\n\n\n<p>Happy FontStructing!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>As promised, today we\u2019re introducing a series of new features, enhancements and bug fixes to FontStruct. Line Height Control (Vertical Metrics) Until now, FontStruct has automatically calculated the overall line-height and line-spacing for each downloaded font. This is usually fine, but every now and again people request manual control over these values. Today we\u2019re giving [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-3669","post","type-post","status-publish","format-standard","hentry","category-news"],"_links":{"self":[{"href":"https:\/\/fontstruct.com\/news\/wp-json\/wp\/v2\/posts\/3669","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fontstruct.com\/news\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fontstruct.com\/news\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fontstruct.com\/news\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/fontstruct.com\/news\/wp-json\/wp\/v2\/comments?post=3669"}],"version-history":[{"count":41,"href":"https:\/\/fontstruct.com\/news\/wp-json\/wp\/v2\/posts\/3669\/revisions"}],"predecessor-version":[{"id":3714,"href":"https:\/\/fontstruct.com\/news\/wp-json\/wp\/v2\/posts\/3669\/revisions\/3714"}],"wp:attachment":[{"href":"https:\/\/fontstruct.com\/news\/wp-json\/wp\/v2\/media?parent=3669"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fontstruct.com\/news\/wp-json\/wp\/v2\/categories?post=3669"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fontstruct.com\/news\/wp-json\/wp\/v2\/tags?post=3669"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}