iOS mobile preview shows wrong font weight
I just downloaded the latest September update + the iOS preview mobile app. I love how fast and "real time" it is, but I found an issue with some fonts weight.
For example, for a very common font like Open Sans, on mobile preview only the "Regular" weight is rendered correctly.
Light, Semibold, Bold, Extrabold weights are all displayed as Regular by default on mobile, while on my laptop screen they are displayed correctly as usual.
Same thing for the Lato font, I cannot display the Hairline and Light weights on mobile preview.
This is not great because I use those fonts and weights in many of my projects and it makes the whole mobile preview pretty much useless for me.
It seems like Typekit fonts like Proxima Nova are working fine.
Is there any way around it?
Many thanks. Keep up the good work.
13 commentsComments are closed
it links to the wrong page as my desktop side is right
Adrián Marzal commented
I have this same error, I have the latest version of XD available (August 22 - 2017). With the font "Bariol" ( http://atipofoundry.com/fonts/bariol ) On the desktop I can see everthing ok, but on the iPhone app the "Regular" font won't display. If I share the link to the project, the "Regular" type is displayed correctly, the font is missing only on the XD iPhone app. Everytime I want to check de design I have to self-share the link and open it in the iPhone....
Cyrill Studer commented
I also just experienced the issue with a non-TypeKit-font (Simplon) with iOS app version 1.2.2 on a iPad and macOS app version 0.6.24.10 Beta.
It seems that it renders some cuts totally fine but for example the medium cut of this font is substituted by some fallback font. But as soon as I change any text specifications of the respective text field or group/ungroup it the font is rendered correctly.
Maybe it's got something to do with multiple text styles in one text field. Because this medium cut I was talking bout was followed by a light cut within the same text field.
This issue seems to be back with the latest December release :(
I am previewing a screen where I used Lato font, with 3 different weights. But all I see on my iPhone is the Bold weight.
I tested it and it does work correctly now. Thanks a lot for fixing!
I have the same Problem with San Francisco Display/Text (Downloaded from Apple). SF Compact Rounded works great with any font weight.
With SF UI Text, only Regular and Medium works. With SF UI Display, only Light and Regular works.
AdminMasahito Kagita (Admin, Adobe) commented
Thanks for your report.
We were able to reproduce the issue with Latos font. We are working on a fix for the next release.
If others have issues with specific fonts, would you please let us know which fonts and we can try to investigate.
I believe the core issue is that the work we do in the XD desktop software app doesn't faithfully mirror onto the 'mirror' app. It is completely pointless to consider using it in it's current state.
Hi Anonymous Admin,
thanks for your reply, but after reading your message, I don't think you have read my bug report in detail.
In my bug description I mentioned 2 very specific fonts. Some of the most used Google Fonts ever: Open Sans and Lato.
These fonts are rendered on my mobile preview, but not all the weights are rendered correctly. In case of Open Sans, only the Regular weight is displayed correctly. All the other weights are rendered as Regular by default.
I double checked that my fonts are present on my machine via the Font Book app. I can use these fonts and all the weights installed on every piece of software present on my machine.
And I have no problem at all with the Mirror Sketch app, which I believe is the product you guys should look at and try to improve.
As I said, I am not talking about weird/crazy/heavy fonts found on some shady website.. I am talking about very popular web fonts used all over the place.
Do you see the same issue I am seeing with Open Sans and Lato?
This issue is making the mobile preview basically useless for me, so it would be nice to know if this is going to be fixed.
AdminChris Nuuja (Admin, Adobe) commented
regarding 1). You can launch an app called Font Book (default OSX app) to see what fonts you currently have installed on your machine. Internally, we've been confused in the past with projects that use the San Francisco font (default iOS font). Its not installed by default on OSX devices, you have to download it from Apple https://developer.apple.com/fonts/ San Francisco Compact is used for iWatch and is not installed on the iOS device by default.
AdminChris Nuuja (Admin, Adobe) commented
When a document uses a font that is not present on the iOS device, XD Mobile will ask its desktop host to send that font over the usb connection. There are several reasons why a font might fail to be sent over. An upcoming release of the XD mobile app will list the name of each missing font and the reason why transfer failed. Those reasons include:
1) it can't be found. If a project uses font 'foo' and that font is not present on the (desktop) machine, XD will silently replace it with a system default font. If 'foo' is also not present on the iOS device, then we'll ask the desktop XD for it and get this error in reply. iOS has a different default system font.
2) the font licensing says its not allowed. Fonts have licensing permissions embedded in them. Those permissions can say it is forbidden to send that font over to any other device for display purposes.
3) its too big. Memory on iOS devices is generally a mere 1GB (for everything that is running). Some fonts can be very large. We cap the size of the font at a max of 50MB. The limit is arbitrary an could be changed. Realistically, though, its probably not a good idea to design iOS UI using custom fonts that are that big.
4) that font type is not supported in iOS. Type 1 fonts, for instance, can't be rendered on iOS. Best to convert to another type.
'Missing Fonts' it says on my mobile when viewing my design work. It might as well just say ' Missing Design Work' as the design is rendered useless by the lack of the fonts used?! This is poor guys. Have you anything to say on this matter...?
Rob Wootten commented
I'm having the exact same issue. Difficult to design when the app doesn't display the exact design.