4 ms·

Ah the introduction of flat toolbars and the subsequent race to copy it (in MFC): https://www.codeguru.com/cpp/controls/toolbar/flattoolbar/article.php/c2535/F

by lsllc 5y ago

Ah the introduction of flat toolbars and the subsequent race to copy it (in MFC): https://www.codeguru.com/cpp/controls/toolbar/flattoolbar/article.php/c2535/Flat-Toolbar-requires-IE3.htm https://www.codeguru.com/cpp/controls/toolbar/flattoolbar/ar... Good times!

linguae 5y ago
This brings back memories of playing around with Visual Basic 6 as an 11 year old, trying to figure out how exactly Microsoft came up with the flat toolbars used in Internet Explorer and Microsoft Office 97 while the toolbar controls provided by Visual Basic were the standard Windows 95 rows of buttons (though VB 6 itself used flat toolbars). Today I have no issues making flat toolbars even from scratch, but my 11 year-old self had no idea how to come up with them. Still, sometimes I miss being a kid.
aendruk 5y ago
What does “flat” mean here? I tried looking up screenshots of this but they just look… normal.
- Kwpolska 5y ago
  The non-flat toolbars had each button separate, with its own border. IE 3 did away with the borders. (Also seen in Office 97 vs 95, for example.) Compare the screenshots: https://upload.wikimedia.org/wikipedia/en/c/c5/Internet_Explorer_3_on_Windows_95.png https://upload.wikimedia.org/wikipedia/en/c/c5/Internet_Expl... https://upload.wikimedia.org/wikipedia/en/b/b3/Internet_Explorer_2.PNG https://upload.wikimedia.org/wikipedia/en/b/b3/Internet_Expl... or in Office: https://upload.wikimedia.org/wikipedia/en/4/4a/Office_97_on_Windows_NT_4.0.png https://upload.wikimedia.org/wikipedia/en/4/4a/Office_97_on_... https://upload.wikimedia.org/wikipedia/en/9/92/Office_95_on_Windows_NT_4.0.png https://upload.wikimedia.org/wikipedia/en/9/92/Office_95_on_...
- laumars 5y ago
  From a modern perspective they might. But that is because these days everyone designs flat toolbars. However in the early days of OS design each button on the toolbar looked like a distinct button. Microsoft then flattened the buttons while keeping a bevel on the toolbar itself (latter even that would disappear) — which is the effect being discussed here. Back in the 90s there used to be a great discussion over the flat design (aka Microsoft) vs skeuomorphic design (aka Apple) in terms of usability with most designers vocally preferring skeuomorphic citing usability as their reasons. Albeit some did still think Apple took their use skeuomorphic design too far. It’s funny how flat design eventually won out across all platforms and not just at Microsoft and Apple; later Google with Cardboard (et al) too. In the 90s this was quite a hot topic of debate.
  - lwhi 5y ago
    A nice overview, but it feels like the dates are out. Flat design came in much later than the 90s .. Web 2.0 was all about curved corners and gradients .. flat design was introduced in 2010s.
    - laumars 5y ago
      Noooo. I was a desktop software developer in the 90s and the conversation definitely started then. Remember we are talking about desktop software not web development (and by the late 90s bevels were seen as archaic as “under maintenance” GIFs). To illustrate the timeline: Windows MSIs were often compared to Install Shield with regards to the difference between the newer flat design elements of Microsoft vs the older 3D objects of the previous iterations of Windows. By Windows 2000 Microsoft had already cemented that flat design was their way forward. Sure buttons were still 3D but a lot of other design elements had been flattened or removed entirely (panels, toolbars, image boarders, editable text areas in some cases too). While you are right that Metro / Modern was another massive leap forward in terms of flat design, by that point Apple had already dropped much of their skeuomorphic design elements. So the discussions by that point were less about skeuomorphism vs flat design and more about accessibility concerns with regards to removing all hints of 3D in flat design. Basically by 2010 flat design had already largely won over skeuomorphic design. So while designers were still endlessly debating these things, it certainly wasn’t the start of the conversation.
      - lwhi 5y ago
        The Wikipedia 'flat design' article might need updating with this information. I see your point re. desktop UI elements, but I think 'flat design' became a zeitgeist term in the 2010s for the majority of creatives / graphic designers.
        laumars 5y ago
        Wikipedia already does hint at that information: > In 2002, Microsoft released Windows Media Center > Microsoft continued this style of design with the 2010 release of Windows Phone 7 (emphasis mine) But you have to bare in mind that article is about more than just desktop application development. Maybe what’s needed is a separate article to talk about the history of software interfaces (maybe there already is an article?)

by lsllc 5y ago

linguae 5y ago

This brings back memories of playing around with Visual Basic 6 as an 11 year old, trying to figure out how exactly Microsoft came up with the flat toolbars used in Internet Explorer and Microsoft Office 97 while the toolbar controls provided by Visual Basic were the standard Windows 95 rows of buttons (though VB 6 itself used flat toolbars). Today I have no issues making flat toolbars even from scratch, but my 11 year-old self had no idea how to come up with them. Still, sometimes I miss being a kid.

aendruk 5y ago

What does “flat” mean here? I tried looking up screenshots of this but they just look… normal.

Kwpolska 5y ago
The non-flat toolbars had each button separate, with its own border. IE 3 did away with the borders. (Also seen in Office 97 vs 95, for example.) Compare the screenshots: https://upload.wikimedia.org/wikipedia/en/c/c5/Internet_Explorer_3_on_Windows_95.png https://upload.wikimedia.org/wikipedia/en/c/c5/Internet_Expl... https://upload.wikimedia.org/wikipedia/en/b/b3/Internet_Explorer_2.PNG https://upload.wikimedia.org/wikipedia/en/b/b3/Internet_Expl... or in Office: https://upload.wikimedia.org/wikipedia/en/4/4a/Office_97_on_Windows_NT_4.0.png https://upload.wikimedia.org/wikipedia/en/4/4a/Office_97_on_... https://upload.wikimedia.org/wikipedia/en/9/92/Office_95_on_Windows_NT_4.0.png https://upload.wikimedia.org/wikipedia/en/9/92/Office_95_on_...
laumars 5y ago
From a modern perspective they might. But that is because these days everyone designs flat toolbars. However in the early days of OS design each button on the toolbar looked like a distinct button. Microsoft then flattened the buttons while keeping a bevel on the toolbar itself (latter even that would disappear) — which is the effect being discussed here. Back in the 90s there used to be a great discussion over the flat design (aka Microsoft) vs skeuomorphic design (aka Apple) in terms of usability with most designers vocally preferring skeuomorphic citing usability as their reasons. Albeit some did still think Apple took their use skeuomorphic design too far. It’s funny how flat design eventually won out across all platforms and not just at Microsoft and Apple; later Google with Cardboard (et al) too. In the 90s this was quite a hot topic of debate.
- lwhi 5y ago
  A nice overview, but it feels like the dates are out. Flat design came in much later than the 90s .. Web 2.0 was all about curved corners and gradients .. flat design was introduced in 2010s.
  - laumars 5y ago
    Noooo. I was a desktop software developer in the 90s and the conversation definitely started then. Remember we are talking about desktop software not web development (and by the late 90s bevels were seen as archaic as “under maintenance” GIFs). To illustrate the timeline: Windows MSIs were often compared to Install Shield with regards to the difference between the newer flat design elements of Microsoft vs the older 3D objects of the previous iterations of Windows. By Windows 2000 Microsoft had already cemented that flat design was their way forward. Sure buttons were still 3D but a lot of other design elements had been flattened or removed entirely (panels, toolbars, image boarders, editable text areas in some cases too). While you are right that Metro / Modern was another massive leap forward in terms of flat design, by that point Apple had already dropped much of their skeuomorphic design elements. So the discussions by that point were less about skeuomorphism vs flat design and more about accessibility concerns with regards to removing all hints of 3D in flat design. Basically by 2010 flat design had already largely won over skeuomorphic design. So while designers were still endlessly debating these things, it certainly wasn’t the start of the conversation.
    - lwhi 5y ago
      The Wikipedia 'flat design' article might need updating with this information. I see your point re. desktop UI elements, but I think 'flat design' became a zeitgeist term in the 2010s for the majority of creatives / graphic designers.
      - laumars 5y ago
        Wikipedia already does hint at that information: > In 2002, Microsoft released Windows Media Center > Microsoft continued this style of design with the 2010 release of Windows Phone 7 (emphasis mine) But you have to bare in mind that article is about more than just desktop application development. Maybe what’s needed is a separate article to talk about the history of software interfaces (maybe there already is an article?)