Q. What is the Design Library?

It's a site where we have gathered descriptions and code for our commonly used global components. The material is based on our brand and enables a red (or green) thread when creating a digital SEB experience. 

We'd like to think of the Design Library as the bridge between ux and development. An umbrella that covers all the frameworks, but holds none. As the beacon of light... ok, I got carried away there.

Q. Why should I use it?

Here are a few ideas:

• It will be easy to see what the latest bid is!
• The content is current and useful as the teams themselves contribute with code!
• In true agile fashion, it supports self-governanced teams - as the teams get to choose their own framework!

Q. Who is it for?

Are you creating or developing a digital experience for SEB? Perhaps a product owner, requirements specialist, user experience specialist, developer, tester? Then this is the site for you.

Q. How does it work?

We do this together!

• Anyone can describe the need for a specific component.
• Designed components and their descriptions are usuallu added by the cx-team.
• Developer teams add coded components in their chosen framework.
• Ta-da! Anyone can read the descriptions and re-use the components!

Q. What do you mean by visual identity?

We have lined up the components that you should always re-use - logotype, typography and colours, into one easy package which we call "Visual Identity". Do "npm install" to get the latest! 

Q. What is "Vanilla" anyway?

Vanilla is a component library written in SASS, with markup examples, that is accessible, fully name-spaced, does not depend on any external frameworks, and should play nicely with any other front-end frameworks that may be used in your project.

The name "Vanilla" refers to the fact that we have not chosen any particular front-end technology for vanilla (other than CSS and HTML of course), and we have not made any assumptions about how the logic for these components should be implemented - Vanilla does not include any JavaScript at all.

Q. How can I contribute with code to the components?

Here's how: http://designlibrary.sebank.se/getting-started/for-developers/#contribute 

Q. How can I use the code in the smartest way?

The best way to use the code is by installing it from NPM. Here you can find detailed instructions for NPM: http://designlibrary.sebank.se/getting-started/for-developers/#use

Q. I need a new component. How do I go about this?

I LOVE that you ask that question! So I made a page especially for you:

Need a new component?

Remember that it doesn't matter who you are - anyone can contribute in their own little way. 

Q. When will the site be accessible for the public?

It IS public! Feel free to share it: https://designlibrary.sebgroup.com/. It is almost identical to the internal site, but sometimes we have chosen to hide links to some code. I am sure you can understand this (hint: security reasons). 

Q. I have feedback or questions. How do I get in contact with the Design Library team?

You are more than welcome to contact us! designlibrary@seb.se

Q. And who are you?

The site is built by the team that also build seb.se (Digital Experience & Innovation). The content comes from both our developer and design communities - the same people who are our targeted user groups!