Typography in the Windows Vista User Interface (UI)

on Sep 13, 2007

The release of Windows Vista introduced a refreshed and redesigned user interface (UI) for Windows users, but although the interface features a lot of eye candy in terms of animations and dynamic visual effects (such as blur filters for its glass), it fails at getting the basics right—font alignment. Whenever I switch from using Mac OS X to Windows Vista, the differences in typography on the UI jump right out at me—or indeed, the errors that are present on one of these systems.

As Steve Jobs has said himself, one of the few classes that he enjoyed while he was still at university—or rather the class that he took for fun (while dropping out from others) was in typography. I believe typography and typesetting are one of the things that Mr Jobs really cares about when he develops his products or communications. Apple’s marketing material, Apple’s product packaging, Apple’s OS UI—they all feature beautifully designed fonts that are carefully aligned and set in the right size and weight for the job at hand. On the Mac OS X UI, everything fits where it should be, the fonts are pixel perfect on any menu bar or message. Many of the control fonts that are present in buttons and menus are also of heavier weight and size, meaning they are much easier to see, making the whole system more usable and accessible.

OS 10 system fonts image

OS X: Large system fonts make the interface more accessible

Windows is a completely different affair. Here, fonts seem to be taken for granted, the actual message that they carry seems to be the most vital aspect—so vital in fact it seems that font alignment and selection is barely considered. The new Windows UI font, Segoe UI, introduced a little more style into the system, but from a personal perspective I really dislike it. It is very small and thin, meaning it is difficult to see at small sizes (and most UI fonts are small in Windows). The messages and control labels are misaligned in many cases and there is almost no font differentiation—the size and weight is the same, whether it be a button, or a label, leading for poor user experience for those who notice these things and can appreciate good typesetting.

Vista UI features the same font throughout, not even changing its size or weight, resulting in no focus on any particular element

Who has it right, Apple with its beautiful fonts or Microsoft with its functional UI? In the end, this is not an ‘or’ question. The OS X UI is functional, but in addition to that it is also beautiful. The Windows UI indeed serves a function, but the overall polish is incomplete. The designers have set off on the right road with the Windows Vista UI, you can see that they really wanted to make the whole system look nicer, but they never got the polish right. Fancy glass and animations have added the ‘wow’ factor, but the details have not been ironed out fully.

Vista: Tiny, thin fonts are not making the best use of the space available

Do people care about these small things? Macintosh users certainly love their systems, so much so that the Mac community is almost religious. This love is built up from small things—things that make the user experience better: the simple uncluttered UI, the quick shortcuts, the simple drag and drop mechanisms… and in addition to this, I believe, the well designed and positioned fonts.

OS X: Clean and elegant interface, with simple relationships indicated by visual structure and typography

If you wish to develop a really good UI for electronic or print communication, and this does not only apply to operating systems or marketing posters, this applies to everyday documents and presentations—then you should care about fonts and typesetting. This is only one facet of good design, but if you are serious about making great products, then you should never ignore any facet and make sure you get everything right. I really hope the Microsoft design team has some time to spend on realigning and redesigning some of the fonts for future Vista updates, but in all honestly I cannot see this happening.

I believe the culture at Microsoft (as well as that in 90% of today’s big corporations) is to deliver features, because features translate into selling points, and selling points sell products. The selling points for Microsoft’s products don’t include typography, and don’t focus highly on presentation because of the nature of the business - it’s B2B (business to business). While Microsoft gets the majority of their revenue from business sales, Apple sells to consumers (B2C), which means presentation matters a lot more.

Making sure your product has well designed and set fonts has a blurry ROI (return on investment)—people who do not really care about their products, do not value the impact of great design. I think this is a real shame, because little things like this all add up and in the end do make a really great impact on the user experience and how much they like your product. Apple demonstrated how getting these things right can create a powerful and loyal community who not only like your products, but love them. In the future, when you’re making that new interface or that presentation slide, remember that typography is really important, so make sure you spend a little bit of time on it because quite frankly, nobody really likes to read ugly, misaligned text.


25 Comments »

  1. Comment by Myles de Bastion — Sep 15, 2007 @ 6:51 pm

    I would have to agree that software developers need to pay more attention to font and typography design, especially on the Windows platform, there can be a tendancy for applications to be released that are actually difficult to use because of inconsistant typography. Microsoft should be paying more attention to this crucial element of the UI.

    Trust me, your eyes will be grateful.

  2. Comment by dmitry — Sep 15, 2007 @ 7:58 pm

    Typography isn’t really the main thing Microsoft should be focusing on—there are still many layout issues, as well as content placement. For example, most Windows configuration panels feature a list of options with a tick box next to them. When the list is 10-20 items long, and aligned as one big stack, the only way to find what you’re looking for is to read all of it, which is frustrating and takes time. You have to segment the UI more into logical bits and pieces so the user can finds things faster. They’ve done it quite well with Office 2007, so I think they’re on the right road.

    But yes, typography is something that I think adds the final polish, and differentiates your product from all that competition that just couldn’t be bothered.

  3. Comment by boysfuscush — Jan 29, 2011 @ 1:46 am

    Pleased New Year harry! :)

  4. Trackback by nike air max 90 junior — Feb 9, 2014 @ 3:51 pm

    nike air max 90 junior…

    Pixelshell | Blog » Typography in the Windows Vista User Interface (UI)…

  5. Comment by http://del.icio.us — Dec 5, 2016 @ 11:04 pm

    Nice blog right here! Additionally your website rather a lot up fast!
    What web host are you using? Can I am getting your affiliate hyperlink in your host?
    I wish my website loaded up as fast as yours lol

  6. Comment by lukmed.krapkowice.com.pl — Dec 20, 2017 @ 10:15 am

    Nice post. I was checking continuously this blog and I’m impressed!
    Very helpful information particularly the
    last part :) I care for such information a lot. I was seeking this certain info for a very long time.
    Thank you and good luck.

  7. Comment by http://www.osrodekliturgiczny.pl/component/users/?view=login — Apr 17, 2018 @ 9:25 pm

    What’s Happening i’m new to this, I stumbled upon this I have discovered It positively useful and
    it has helped me out loads. I hope to give a contribution & aid other users like its aided me.
    Good job.

  8. Comment by softx.pl — Jul 7, 2018 @ 10:32 pm

    Hi, its good post concerning media print, we all
    be familiar with media is a great source of facts.

  9. Comment by www.sklepcosmeticderm.pl — Oct 23, 2018 @ 9:49 am

    I’ve read a few just right stuff here. Definitely price bookmarking for
    revisiting. I wonder how a lot effort you
    put to make one of these wonderful informative website.

  10. Comment by www.radioflash.pl — Oct 25, 2018 @ 2:46 am

    It’s awesome for me to have a website, which is helpful in support of my knowledge.
    thanks admin

  11. Comment by https://blog.contentcard.com — Oct 25, 2018 @ 4:18 pm

    It’s actually a nice and useful piece of information.
    I’m glad that you simply shared this helpful information with us.
    Please stay us up to date like this. Thank you for sharing.

  12. Comment by http://www.ottawa-conventions.com/go/link.php?url=http://alefurra.pl/uslugi/niezwykle-popularne-staje-sie-otwieranie-firm/ — Oct 25, 2018 @ 8:22 pm

    This post offers clear idea in support of the new people of blogging, that truly how to do blogging.

  13. Comment by gooru.pl — Nov 30, 2018 @ 6:34 pm

    What’s up to every body, it’s my first pay a visit of this web site;
    this webpage contains remarkable and really good information for visitors.

  14. Comment by http://softnow.pl/redirect?url=http://www.mojepluszaki.pl/aranzacja-wnetrz/podczas-procesu-spalania-nie-roztaczaja-zadengo-zapachu-brak-jest-popiolu/ — Nov 30, 2018 @ 11:45 pm

    Heya fantastic website! Does running a blog similar to this require a massive amount
    work? I’ve absolutely no knowledge of programming but I was hoping to start my own blog soon. Anyway, should you have any
    recommendations or tips for new blog owners please share.
    I understand this is off subject but I just needed to ask.
    Cheers!

  15. Comment by wykop.pl — Dec 1, 2018 @ 12:19 am

    I think that what you posted was very reasonable.
    However, what about this? suppose you were to write a awesome post title?
    I am not saying your information is not solid, however suppose you added
    a headline that grabbed folk’s attention? I mean Pixelshell | Blog » Typography in the Windows Vista User Interface (UI) is a little boring.
    You could glance at Yahoo’s front page and see how they create article headlines to grab people interested.
    You might add a related video or a related pic or two to grab people excited about everything’ve written. In my opinion, it could make your posts a little livelier.

  16. Comment by preview.adocean.pl — Dec 4, 2018 @ 2:20 am

    After looking into a few of the blog posts on your web site,
    I honestly like your way of blogging. I bookmarked it to my bookmark website
    list and will be checking back in the near future. Take a look at my web site as
    well and tell me what you think.

  17. Comment by as-bi.pl — Dec 22, 2018 @ 11:52 pm

    Hey there this is somewhat of off topic but I was wondering if blogs use WYSIWYG editors or if you have to manually code with HTML.
    I’m starting a blog soon but have no coding expertise so I wanted to get advice from someone
    with experience. Any help would be enormously appreciated!

  18. Comment by twoja-strona-torrent.pl — Dec 27, 2018 @ 1:56 pm

    I was recommended this website through my cousin. I am not sure whether or not this put up is written by
    way of him as no one else recognise such special approximately my
    problem. You are wonderful! Thank you!

  19. Comment by www.wykop.pl — Mar 31, 2019 @ 10:10 am

    It’s really very difficult in this full of activity life to
    listen news on TV, thus I only use world wide web for that purpose, and obtain the latest news.

  20. Comment by forum.schwarzes-bw.de — Apr 12, 2019 @ 9:36 pm

    This is my first time go to see at here and i am truly pleassant to read all at alone place.

  21. Comment by https://bimbo.land/bimbo/hudf91/91586 — May 13, 2019 @ 7:12 am

    Super artykuł

  22. Comment by steepster.com — May 13, 2019 @ 4:21 pm

    Super wpis

  23. Comment by http://www.thewhole9.com/ibhzy87 — May 13, 2019 @ 5:49 pm

    Super wpis

  24. Comment by kartyo.pl — May 21, 2019 @ 11:03 am

    It’s really a nice and helpful piece of info. I’m satisfied that you shared this useful
    information with us. Please keep us up to date like this. Thank you for sharing.

  25. Comment by qtko.pl — May 29, 2019 @ 12:16 pm

    Hi there, all is going sound here and ofcourse every one is
    sharing data, that’s truly fine, keep up writing.

RSS feed for comments on this post. TrackBack URL

Leave a comment

Contact Information

If you would like a quote or a project proposal, just click here to fill in our short client web form and we'll get right back to you.

Direct Contact Details

Email Email: info@pixelshell.com Skype Tel: +44 (0)20 8816 8876