NYPLBase

The Library's various web properties have long been in need of some design and branding unification. To achieve that consistency, we need to be able to easily experiment, develop, codify, and disseminate our design. What we needed was a rapid prototyping system, or what is sometimes called a "living style guide."

The best-known example of this kind of toolset is Twitter Bootstrap, which was developed by Mark Otto and Jacob Thornton at Twitter as a way to keep their properties and internal tools consistent. Since the release of an open-source version of their project, you can download the Bootstrap package and override the styles to suit your own project; however, I felt we needed more customization and flexibility than overrides could provide. (Also, overrides can take a lot of time and repeated code.)

I researched several frameworks and chose InuitCSS, because:

• it’s built on principles of object-oriented development, which makes it modular
• it uses proportional (rather than column-based) layouts, which makes it more flexible
• it does not include styling or branding of any kind, which eliminates the need for overrides
• it’s device-agnostic and responsive

Some slightly esoteric/goofy names were in the running for this project, but I went with NYPLBase (or familiarly, "Base") because this code provides a "base" for all our web properties. Color palette, typeface, default styles, and a bit of structure is all built into this code package. We can use it internally to rapid-prototype and test right away, we can use it as design reference, we can build a sustainable, adaptable pattern library, and we save time and money on projects because our brand is built in. Future redesigns will benefit from sustainable, consistent branding, time and money saved internally, and a smaller learning curve for our consulting agency partners. And even if you're not working directly with code, you can still use the style guide.

Currently I'm using Base to build and test design patterns, and consulting with our Marketing team to make sure the branding is expressed correctly. I'm working directly in the code for Base so that I can make fixes to the core as I go. At the moment, I'm the only developer allowed to work like this. At some point I will start accepting pull requests on GitHub from Trusted Colleagues; I imagine once Labs gets ahold of it, they will unearth the need for many more design patterns. and all those ppl will be able (again, when appropriate) to contribute back to the project, so that this code will improve, iterate, and grow.

Note: this style guide is a work in progress, and runs off of Base itself, so please be patient with any bugs or other weirdness.
Thanks, jennifer Anderson, Senior UX Designer