Highlighted

SF Symbols won't appear in prototypes

New Here ,
Oct 21, 2020

Copy link to clipboard

Copied

So, first of all, I'm new to Adobe XD, I've always used Figma. The thing is I'm doing this iPhone app prototype and I'm using SF fonts. SF font by itself works fine, both in desktop and in the prototype. The problem is when using SF Symbols, wich I believe is some sort of new font/program Apple released recently (not sure tho). So this font doesn't appear in fonts lists in any program, not even Apple one's like Pages or Keynote. For using these symbols you have to go to this program called SF Symbols, look for the one you need, copy it and paste it as text in the program you're working, Adobe XD in this case.

 

Now, the problem is XD seems to recognize the symbols when working in the desktop program but when testing the prototype on my phone there are [?] errors where symbols should be. For testing it I used Adobe XD app and select the project from the cloud, don't know if there's another way. I attached some screenshots where you can see what I'm talking about.

 

Screenshot 2020-10-21 at 18.36.39.pngScreenshot 2020-10-21 at 18.36.50.pngIMG_0779.pngIMG_0780.pngIMG_0781.pngIMG_0782.png

TOPICS
Data loss, Prototyping

Views

200

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

SF Symbols won't appear in prototypes

New Here ,
Oct 21, 2020

Copy link to clipboard

Copied

So, first of all, I'm new to Adobe XD, I've always used Figma. The thing is I'm doing this iPhone app prototype and I'm using SF fonts. SF font by itself works fine, both in desktop and in the prototype. The problem is when using SF Symbols, wich I believe is some sort of new font/program Apple released recently (not sure tho). So this font doesn't appear in fonts lists in any program, not even Apple one's like Pages or Keynote. For using these symbols you have to go to this program called SF Symbols, look for the one you need, copy it and paste it as text in the program you're working, Adobe XD in this case.

 

Now, the problem is XD seems to recognize the symbols when working in the desktop program but when testing the prototype on my phone there are [?] errors where symbols should be. For testing it I used Adobe XD app and select the project from the cloud, don't know if there's another way. I attached some screenshots where you can see what I'm talking about.

 

Screenshot 2020-10-21 at 18.36.39.pngScreenshot 2020-10-21 at 18.36.50.pngIMG_0779.pngIMG_0780.pngIMG_0781.pngIMG_0782.png

TOPICS
Data loss, Prototyping

Views

201

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Oct 21, 2020 0
Adobe Employee ,
Oct 21, 2020

Copy link to clipboard

Copied

Hi there,

 

Thanks for reaching out. While previewing the design on the mobile device if the fonts are not transferred then it gets replaced by the system font. So please install the font on the mobile device and then check if it works or if you need any further assistance. 

 

Regards

Rishabh

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Oct 21, 2020 0
New Here ,
Oct 21, 2020

Copy link to clipboard

Copied

That's the problem, I don't know how to transfer this font because it doesn't work as a font itself. It doesn't appear in my Mac as an installed font because it's a program, not a font itself. As I said before, it doesn't even appear in the font lists in Apple's programs like FontBook, Pages or Keynote. 

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Oct 21, 2020 0
Adobe Employee ,
Nov 09, 2020

Copy link to clipboard

Copied

Sorry for the delay in response. 

Here are some ways to manage fonts on your mobile:

  • When possible, fonts are sent to your device when you preview on mobile. However certain font vendors do not allow for the transfer, display, and distribution of their fonts. You are responsible for ensuring that you respect the font license agreement between you and the font vendor.
  • While viewing a prototype on mobile, if the required font is not present on your device, you get an alert message. The missing fonts are substituted with available fonts.
  • Adobe fonts
    Adobe Fonts will auto-activate and display correctly when previewing an XD cloud document in the XD iOS or Android mobile apps.
  • Non-Adobe fonts
    iOS 13.0 supports installing custom fonts. Users can install custom fonts through third-party apps using methods that Apple provides, or by using the Creative Cloud iOS mobile app (iOS 13.1 and later).

 

For more information, please refer to this article: https://helpx.adobe.com/ca/xd/user-guide.html/ca/xd/help/preview-mobile.ug.html

 

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Nov 09, 2020 1