GNB Design System UI Kit
The GNB Design System UI Kit is essential for UI/UX designers. It consists of styles and reusable components you can use to design hi-fidelity prototypes for websites and applications. The kit will be available for Adobe XD with linked libraries hosted on Adobe Creative Cloud.
The GNB Design System UI Kit is in development. Request access to get notified when it's ready.
Connect to the Adobe Creative Cloud Library
Connect your GNB Design System UI Kit to the GNB Design System Adobe Creative Cloud Library. Updates will automatically synchronize to your UI kit, so you'll always be working with the latest components.
The Adobe Creative Cloud Library is in development. Request access to get notified when it's ready.
Installation and set-up
The GNB Design System UI Kit consists of a variety of pre-made components including buttons, cards, forms, navigation menus, and more. Here is a step-by-step guide on how to effectively use the kit in your design process.
-
Get Adobe XD
Adobe XD must be installed and able to access Adobe Create Cloud on your device.
-
Install the fonts
Install the DM Serif Text and Public Sans font families. Once installed, they will be available for use in Adobe XD.
-
Get the Adobe XD file
Request the GNB Design System UI Kit from the GNB Design System team and download the .xd file from the link provided.
-
Request access to the library
Request access to the GNB Design System Adobe Creative Cloud Library. This will allow you to connect your kit and design files to the library for automatic updates.
-
Connect your kit to the library
Once your request has been approved, open Adobe XD, go to the Libraries pane and add the GNB Design System. You can now access GNB Design System components directly from Adobe XD's interface, and your GNB Design System UI Kit will stay up-to-date.
-
Start Designing
Drag and drop GNB Design System components onto your design canvas.