Android UI font - Design, Prototyping, UI, Graphics

Hi, I have a quick question for all of you. We know that Roboto is the standard font that we need to use for our Android App. Google Material design specification mentions about Roboto font.. I would like to know can designer/developer use different fonts like Open Sans, sans-serif etc for designing the android UI. Could you please suggest how to use different fonts for Android design? Does it break any rules or does it work in every android screen density? Is it mandatory to use the Roboto font?

android_56576576 said:
Hi, I have a quick question for all of you. We know that Roboto is the standard font that we need to use for our Android App. Google Material design specification mentions about Roboto font.. I would like to know can designer/developer use different fonts like Open Sans, sans-serif etc for designing the android UI. Could you please suggest how to use different fonts for Android design? Does it break any rules or does it work in every android screen density? Is it mandatory to use the Roboto font?
Click to expand...
Click to collapse
Hi,
I read your query and would like to share my experience regarding the fonts used in Android applications. Roboto is the standard font because its visual effects are nice on the device but, it doesn't make it a mandatory choice while app development. You may go for whichever font suits your application until it doesn't make the app interface messy. Also, while choosing the font, you should not try to opt for multiple varieties of styles for a single application. One font style is enough to make app text clear and effective.
Thanks.

Related

Windows Phone 7 Font {Segoe WP} Series

If you installed Visual Studio 2010 on your PC, you can simply go to "C:\Windows\Fonts\" dirctory..
and select this Family Font "Segoe WP" which stands for Segoe Windows Phone.
And this font is useful for themes devs and apps devs to create a real WP7 theme or app.
For those who do not have VS2010, simply download the attached file.
Thanks for sharing this
very nice, thanks
Thanks - this is exactly what I was looking for!
any chance you could just zip up the fonts vs. having an exe file? thanks
here you go!
Awesome, thanks for this. Now to muck around changing system fonts on my HD2..
cortez.i said:
any chance you could just zip up the fonts vs. having an exe file? thanks
Click to expand...
Click to collapse
You can simply unzip that .exe (i.e. using 7zip).
Thanks guys for that, and working on a brilliant wp7 theme
I have VS2010 but don't have the fonts So thanks a lot for the download
Missing app
jonnywright said:
I have VS2010 but don't have the fonts So thanks a lot for the download
Click to expand...
Click to collapse
Of course you don't, because you must install also Visual Studio Express For Windows Phone, it's free @ Microsoft.
lead answer
Hey, well nice things have written here and you know i am very shocked to see that how much knowledge people have , they have spent a lot of time in this.
hanaheeno said:
If you installed Visual Studio 2010 on your PC, you can simply go to "C:\Windows\Fonts\" dirctory..
and select this Family Font "Segoe WP" which stands for Segoe Windows Phone.
And this font is useful for themes devs and apps devs to create a real WP7 theme or app.
For those who do not have VS2010, simply download the attached file.
Click to expand...
Click to collapse
How can I put those fonts to WP7?
alfa-batsi said:
How can I put those fonts to WP7?
Click to expand...
Click to collapse
It might surprise you a bit, but WP7 already has this font
_DX_ said:
It might surprise you a bit, but WP7 already has this font
Click to expand...
Click to collapse
Yea, but how to change the fonts from the standard one?
Sent from my HTC HD2 using XDA App
how do you change the font sizes in WP7 , I posted this in another thread ,but maybe you guys know, in contacts , the font color is the same as the tile color , can I change the font color in contacts and still have a different tile color , also the size of the font in contacts is so small you need reading glasses to see it, where in the registry can I change the sizes?
These are taken from windows ce , same location, not sure what is what yet
System HKEY_LOCAL_MACHINE\SYSTEM\GDI\SysFnt
Menu bar HKEY_LOCAL_MACHINE\SYSTEM\GWE\Menu\BarFnt
Pop-up menu HKEY_LOCAL_MACHINE\SYSTEM\GWE\Menu\PopFnt
Out of Memory window HKEY_LOCAL_MACHINE\SYSTEM\GWE\OOMFnt
Vintage144 said:
how do you change the font sizes in WP7 , I posted this in another thread ,but maybe you guys know, in contacts , the font color is the same as the tile color , can I change the font color in contacts and still have a different tile color , also the size of the font in contacts is so small you need reading glasses to see it, where in the registry can I change the sizes?
Click to expand...
Click to collapse
Hi, Did you solve the way to change contacts color font ? me too i'm using black tiles but cannt see number contacts as are the same black color.. thanks
Havebt been able to change the size,i can change just about every other font sizes and colors but cant change this one,its only a matter of time before its found
Sent from my SGH-i917 using Board Express
Isn't this font identical to Segoe UI, the primary UI font for both Windows Vista and 7, which you therefore certainly already have on your system?

Official WP7 UI design template (28 PSDs) from Microsoft

Microsoft has released - well hidden in its documentation - a design template for Photoshop which consists of 28 PSD files and therefore includes most of the design elements used in Windows Phone 7. Though this is primarily intended for designers who need to mock up the interface for an application (in which case you should also check out the UI Design and Interaction Guide), it's also a very useful resource for creating custom themes and skins based on the Metro design of Microsoft's upcoming mobile operating system. To quote the MSDN page:
A collection of 28 layered Photoshop template files that can be used to create pixel-perfect application layouts, to help guide UI development, or to pitch an idea. These design templates showcase many controls that are a part of the Windows Phone Developer Tools Beta. They also include examples of controls that are a part of Windows Phone, but are not available as a part of the Windows Phone Developer Tools. These additional templates are included to help designers and developers maintain a consistent look and feel across applications for system controls that developers wish to mimic. Templates in the download: Application Bar & Application Menu, Buttons, Check Box, Context Menu, Date Picker, Dialog Boxes, Edit Control, Hardware, Icons, Keyboard & Input, List Picker, List View, Panorama, Panorama Backgrounds, Picker Box, Pivot, Progress Indicators, Quick Jump Grid, Radio Button, Reminders, Slider, Start & App List, Start Tiles, Status Bar, Theme, Time Picker, Toast Notifications, Toggle Switch
Click to expand...
Click to collapse
Download it here, in case you missed the inline link above (beware, though, it's an 88 MB zipped-up archive)
Thanks to Long Zheng for the find
I also attached all the fonts these PSDs need to render correctly.
Does anyone know if the latest rom contains the Zegoe UI fonts?
These templates use a mix of Segoe UI, Zegoe UI, and Segoe WP with Segoe WP N
And the dump of the first rom, did not include the Zegoe fonts...
Nope it doesn't, but I just attached them (and all the other Segeo WP fonts) in the first post for you to download .
Though it should be noted that Zegoe UI is identical with Segoe WP N, which only difference to the regular Segoe WP is that it's numbers are more traditionally styled, similar to Segoe UI.
Zegoe features serifs on many of the letters, and has a unique uppercase font. I have all the fonts you put into the first post, but Zeoge UI Semilight is missing, and it features in the templates, so I am wondering if someone could dump the latest July rom, or tell me how to dump it, to see if they feature the complete Zegoe font family?
Hmm, from my observations Zegoe UI has no differences to Segoe WP N apart from the Zegoe Caps font you mentioned, though I may be mistaken. Are you sure there's a Zegoe UI SemiLight? I currently don't have Photoshop installed so I can't try it out myself, besides, I have never seen that variant. I'll look around and see what I can find.
Thank you! I try!
Now this is interesting...
I am comparing the fonts in the July Beta ROM, to the ones in the original March one.
The Segoe WP N fonts are no more, they have been removed.
The Segoe WP fonts, have been changed and are now copyrighted as 2010 not 2008.
Fonts like Segoe WP Black now have numbers and letter shapes which are consistent with the other WP fonts.
The Segoe UI Bold and Regular fonts, contain serifs on the uppercase I, which is interesting as this was one of the differences between Segoe UI and Zegoe UI.
There are no Zegoe fonts, there are no Segoe UI italic fonts (I assume these if used on webpages map to the Segoe WP italic fonts, if they ever get included)
I don't think the Zegoe UI Semilight font is in the ROM, but it is included in the Zune PC software in the ZuneShellResources.dll.
~Johnny said:
I don't think the Zegoe UI Semilight font is in the ROM, but it is included in the Zune PC software in the ZuneShellResources.dll.
Click to expand...
Click to collapse
Brilliant, thank you! BTW, what resource editor/extractor do you use?
I have been looking through that file using Restorator 2009, and I find the Bold Zegoe Caps font as TTF, and two versions of the light font as TTC files.
Segoe UI Z Light, with Uppercase and Lowercase versions all in one TTC File
Cegoe UI Light, with Uppercase and Lowercase versions (some letters like the I and Q are different) all in one TTC File
And that's all I can find...
Quite nice. Now we'll probably get the Pivot and Panorama controls soon.
Btw. This should be in the software development section, not hardware
Very cool indeed. Wonderful find and thank you for sharing. These will come in handy
Thank you very much for the template.

[FONT PACK] Flashable Helvetica Neue Light Fontpack

Hi everyone! For the longest time I've searched over the internet and XDA for a proper Helvetica Neue Light font pack. After trying various premade font packs and combining others, not one single font pack contained the proper, original fonts. Some font packs contained hinted versions of the font, which I think look absolutely hideous. Without any luck, I stopped searching and decided to create my own Helvetica Neue Light font pack.
Below are listed which weights were used in this font pack:
Regular:Light
Light: Thin
Thin: Ultralight
Bold: Light (But rendered slightly thicker)
Condensed: Same
Bold-Cond.: Same
Because I favor the lighter fonts, I obviously chose the lighter weight fonts for each type rather than the original weight. These fonts are not hinted and look absolutely gorgeous on the high-res screen. The fonts are similar to those used in iOS 7. The only problem with these fonts are with the alignment. Most of the time it's perfect. Sometimes the alignment can be off; I do not know how to fix it. Anyways, I’ve attached a few screenshots to show how the font looks throughout Android.
Download in attatchments.
Thanks for this. Is it ok to flash on sence based ROMs?
Sent from my HTC One using XDA Premium 4 mobile app
elfrosto said:
Thanks for this. Is it ok to flash on sence based ROMs?
Sent from my HTC One using XDA Premium 4 mobile app
Click to expand...
Click to collapse
+1
What rom are you running?
Yes it should work. In fact it should work on most, if not all, 4.3 and 4.4 roms.
seems does not work on viperone3.1rc2
Any chance for a revert zip just in case we want to go back without reinstalling entire ROM?
Sent from my HTC One using xda app-developers app
I just made the revert flashable zip in attachment
I love it but...
Drik-C said:
I just made the revert flashable zip in attachment
Click to expand...
Click to collapse
I Install the fonts, but I get a FC in google search on Android 4.4.2 KitKat on Moto G
Can you fix it?
Thanks in advance
pankakes said:
Hi everyone! For the longest time I've searched over the internet and XDA for a proper Helvetica Neue Light font pack. After trying various premade font packs and combining others, not one single font pack contained the proper, original fonts. Some font packs contained hinted versions of the font, which I think look absolutely hideous. Without any luck, I stopped searching and decided to create my own Helvetica Neue Light font pack.
Below are listed which weights were used in this font pack:
Regular:Light
Light: Thin
Thin: Ultralight
Bold: Light (But rendered slightly thicker)
Condensed: Same
Bold-Cond.: Same
Because I favor the lighter fonts, I obviously chose the lighter weight fonts for each type rather than the original weight. These fonts are not hinted and look absolutely gorgeous on the high-res screen. The fonts are similar to those used in iOS 7. The only problem with these fonts are with the alignment. Most of the time it's perfect. Sometimes the alignment can be off; I do not know how to fix it. Anyways, I’ve attached a few screenshots to show how the font looks throughout Android.
Download in attatchments.
Click to expand...
Click to collapse
Does this font pack include the norwegian letters æøå and ÆØÅ ?
Opius90 said:
Does this font pack include the norwegian letters æøå and ÆØÅ ?
Click to expand...
Click to collapse
Yes it does
I liked this font but I got a problem with some apps they crash when launching them :/ it's the font because I tried other fonts and the apps runs as normal
Enviado desde mi iPad con Tapatalk
Wow, thank you! Like you, I have been searching for the perfect Helvetica Neue font, and this one is just what I've been looking for. Haven't had any fc's, running ViperOne 5.8.0.
Sent from my HTC One using xda app-developers app
compatibility with Unicode
Is it compatible with Unicode text like "ậ", "ắ", "ư" ?
Looks Fab ? Thanx bro
doesnt work
Bootload stuck on GT-S7392 when flashing this
pankakes said:
Hi everyone! For the longest time I've searched over the internet and XDA for a proper Helvetica Neue Light font pack. After trying various premade font packs and combining others, not one single font pack contained the proper, original fonts. Some font packs contained hinted versions of the font, which I think look absolutely hideous. Without any luck, I stopped searching and decided to create my own Helvetica Neue Light font pack.
Below are listed which weights were used in this font pack:
Regular:Light
Light: Thin
Thin: Ultralight
Bold: Light (But rendered slightly thicker)
Condensed: Same
Bold-Cond.: Same
Because I favor the lighter fonts, I obviously chose the lighter weight fonts for each type rather than the original weight. These fonts are not hinted and look absolutely gorgeous on the high-res screen. The fonts are similar to those used in iOS 7. The only problem with these fonts are with the alignment. Most of the time it's perfect. Sometimes the alignment can be off; I do not know how to fix it. Anyways, I’ve attached a few screenshots to show how the font looks throughout Android.
Download in attatchments.
Click to expand...
Click to collapse
Wow mate, this looks gorgeous! I appreciate your work!
FOR ANYONE WHO SAYS IT DOESNT WORK: Extract all fonts from .zip and copy them manually with root explorer in directory /system/fonts/
I have a question though... I see my HTC M8 already have more types of default font and because of that when I copy your files to my phone system/fonts/ directory, it doesnt replace all the files... :/ Some of the files stay from Roboto font...
I have included an image where are shown all default fonts, so is it maybe possible for you to include missing fonts and post them here so I can change all of default fonts? I would really appreciate it... Because right now a lot of times there is Helvetica, but sometimes some apps, or some headings, or subheadings, or titles are still in Roboto font...
Thank you again for everything
Kind regards

Changing EMUI font / customising stock themes

The font size in EMUI apps (eg Launcher, messaging etc) is narrower and smaller than the system font for regular Android apps (eg Gmail, Tapatalk)
I want to increase the size of the EMUI font to be the same as the regular apps. I tried increasing the font size in settings, but this also increases the font size across all apps.
How can I just change the EMUI theme font and size?
Is there a way to edit / customise the default EMUI themes? I tried the Huawei Theme Creator app from play Store but it appears you can only create a theme from scratch.
I'd also love to remove the app icon border masks too! Thanks
Sent from my PLK-L01 using Tapatalk
SMS font and bubbles too space wasteful
I agree! And also, is there a way how to PERMANENTLY decrease the size of the font and especially of the bubbles in the sms environment (for example in the same way as Telegram or Whatsapp show messages, i. e. very dense)? The bubbles are too big and the margins between sms text and bubble are too wide. I find it too space consuming, so very little messages fit into the screen. I mean, why would I have 5.2" screen phone if onle three of four messages fit in? I know I can pinch the screen to make it smaller, but this only last till I get out from the sms application. Is there any way how to fix this, please?
Someone help me remove these app border masks please!
Sent from my PLK-L01 using Tapatalk
can one assist me to change dfult font i have been try install font bad luck
meza101 said:
The font size in EMUI apps (eg Launcher, messaging etc) is narrower and smaller than the system font for regular Android apps (eg G
mail, Tapatalk)
I want to increase the size of the EMUI font to be the same as the regular apps. I tried increasing the font size in settings, but this also increases the font size across all apps.
How can I just change the EMUI theme font and size?
Is there a way to edit / customise the default EMUI themes? I tried the Huawei Theme Creator app from play Store but it appears you can only create a theme from scratch.
I'd also love to remove the app icon border masks too! Thanks
Sent from my PLK-L01 using Tapatalk
Click to expand...
Click to collapse
You can't change the font, it's a lollipop bug
deV_a said:
You can't change the font, it's a lollipop bug
Click to expand...
Click to collapse
Does anyone know if it's fixed in Marshmallow?
Ie Can you change the size or choose an alternative font in EMUI
Sent from my PLK-L01 using Tapatalk
I'd like to know this too. The standard font (especially on sms) is too small and narrow. The style is also a little tedious. This is the only phone I've ever had that I can't change the font with. There has to be a way too do it, surely. Would rooting and a Font changer/installer app do the business? For all the nonsense that Samsung bring to the table at least you could easily change font's on their devices.
I managed to change the system font by creating a custom theme using a font within the 'ifont' app then dropping it into the emui hwthemes location and changing.
pembo said:
I managed to change the system font by creating a custom theme using a font within the 'ifont' app then dropping it into the emui hwthemes location and changing.
Click to expand...
Click to collapse
It works for me the FontFix app from Google play store by jrummi.
Sent from Honor 7_PLK-TL01H

vector color icons

hey guyz.,
i just wanted to see colored icons on my windows phone, so i started working on it.
but two months back i got an android phone and now i'm too busy.,
i colored few icons(you can see the result in attached images).
so if any of you are interested please color the remaining icons and share.
thank you
@Sai Chrisna, I can tell you truly (nothing personal): if these icons was built in original WP UI, I'll never buy that "colorful" junk
Colored icons actually adds nothing to UI, but color scheme you've used looks really ugly.
sensboston said:
Colored icons actually adds nothing to UI, but color scheme you've used looks really ugly.
Click to expand...
Click to collapse
Yea i know, i'm really bad at adding proper colors and that was also one of the reasons i shared the file here,
That was just a test file and we can always change colors
And i don't know why you didn't like it but all my friends liked it when i showed them
Sorry for the noob question but how do you change the icons on mobile ?
tire_007 said:
Sorry for the noob question but how do you change the icons on mobile ?
Click to expand...
Click to collapse
On interop unlocked phone with full file system access,
* Paste the ttf file in windows \fonts
* Edit the following path HKLM\software\microsoft\windows NT\current version\fonts
Key = Segoe MDL2 Assets
Value = segmdl2_test.ttf
Sai Chrisna said:
And i don't know why you didn't like it but all my friends liked it when i showed them
Click to expand...
Click to collapse
Maybe 'cause I have a "sense of style"? You know, the really good icons (or any miniatures) creation requires a lot of stuff; you can't just colorize vector graphics and get a good result.
From my point of view, one of a great advantages of the "Metro UI" is a simplicity and brevity, and colors are not a part of the whole idea.
As for your friends: all people are different (and it's good of course!), many young guys are using naked gals pics or "Pokemon" themes for their handsets but I'm not of this kind :laugh:
sensboston said:
Maybe 'cause I have a "sense of style"? You know, the really good icons (or any miniatures) creation requires a lot of stuff; you can't just colorize vector graphics and get a good result.
Click to expand...
Click to collapse
If you haven't observed.,
I did not just add colors, i re-edited almost all the main icons, except for the "apps" icon that recently appeared on creators update.
I understand you've got that same old sense of style as Microsoft., No offense, but what's wrong? why don't you keep calm if you are not interested...
There are some people like me who use "third party themes & icons" on desktop and want to apply the same concept here on phone.
Don't post your personal opinions and discourage people who are interested in doing something cool.
perfect ?
but i dont like the android icons
look like setting icon or sim card
A tecnical question
Witch app is used to edit this colored font file ?
Share a dl link to us
High Logic font creator
https://www.youtube.com/watch?v=J4BSK_ASOlw
Sai Chrisna said:
High Logic font creator
https://www.youtube.com/watch?v=J4BSK_ASOlw
Click to expand...
Click to collapse
hey man check your xda private chats and messages
I want to replace
Please help me..... I want to replace with original file
@sensboston
they are good looking icons even if not your style. have you produced any? lately?
@esgibtnur1, they aren't good: bunch of different styles, bad color gamma, not relevant images (to icon's meaning).
As for "have you produced any?": I'm not an artist (but I have a good sense of style) but one of my app tiles ("Voice Translator") was selected by Microsoft to appear on the gift card.

Categories

Resources