#StandWithUkraine

GDS 2.0 & Documentation

Viktor Seč
, Design System Engineer

In George Design System we take documentation seriously. There have been almost 200 documentation improvements in 2.0 alone!

Welcome, new Universes

We offer platform-tuned documentation in separate universes. Previously we had the Web universe and the Store universe.

Now there is a new App universe that covers native iOS and Android George apps. It already has a lot of content!

Photo of a tablet with GDS App universe open in browser. There is grass in the background.

We also introduced the External universe for all the external sites outside of George that are accessed via George.

You can switch between the universes using the menu in the header.

Screenshot of the Universe Picker

We certainly haven’t forgotten about our more mature universes. We added documentation and examples for many previously undocumented components. These are on top of the articles that we merely improved or expanded.

The newcomers are AmountInput, AnchorNavigation, Animation, Carousel, Collapsible, ConditionalSpinner, Confirm Page, CountedTextInput, FileInput, FileList, FocusPage, InfoCardHeader, LabeledList, LanguageProvider, Meter, PrimaryNavigation, Snackbar, Spinner, Stepper, Stripe, Success and Error cards, Tabs, ToggleBadge and VerificationInput.

To make the project more friendly toward new users, we’ve introduced several guides and resources.

Screenshot of a GDS article

Storybook news

The GDS Storybook offers its users (who range from analysts and designers to front-end developers) a quick and simple way to find out what is possible with our components and to tinker with their various states.

We added a toolbar to switch viewport between GDS tiers (XS, SM, MD, LG and XL).

And then there is a new measuring tool for easy checking of the dimensions and spacings.

We are continually improving the stories to make their source code easier to understand and more ready to use. We already have big plans for the future of Storybook, so stay tuned.

Website news

There is a lot going on with this website. We added a table of contents to the side navigation. We’ve expanded the access whitelist of GDS to Erste Group Countries. As long as you are in a VPN or at the office you should not need to authenticate anymore.

We added support for redirects. We can now move pages around without breaking the links that live out in the wild. Sometimes, when an article was split, we display a Wikipedia-like box with an explanation of where to look for the desired information.

We updated almost all the demos so it’s possible to open them directly in Playroom. And of course, we set up this blog to keep you updated.

Component showcase

As for our regular section on new GDS 2.0 components, today we present to you…

OverviewCard

There are new GDS components for George’s overview page.

OverviewCards in grid configuration

OverviewCard has a horizontal configuration as well.

OverviewCards in list configuration

OverviewWidgetCard

You won’t meet this card in George Retail, but it has its place in George Pro.

OverviewWidgetCard