I’m excited to announce the release of a project we’ve been working on for a long while in our free time over at Dragon Army. But first, a preface.
A little history.
UI designers and coders have near endless free and premium resources to help facilitate their workflows and speed up their processes. Seems like a new design kit or front-end framework is released every other day, giving these roles a great and expansive set of tools to use on new projects.
As I transitioned into full-time UX work at Dragon Army, it became obvious to me that those of us in dedicated UX professions do not have nearly the access to free or affordable resources that other roles tend to. It seems like everything we need—from user testing platforms to e-commerce research and even professional training materials—are quite expensive. Not to mention, prototyping tools usually come with pre-built sets of elements, so those of us that do UX design inside Sketch are kind of left out to dry.
Well, at least we were until today.
Introducing, Spark, a new Sketch design library made by Dragon Army exclusively for UX designers!
What exactly is Spark?
Spark is an open-source design kit for building mid-fidelity wireframes and flows in Sketch. It contains a veritable cornucopia of elements, templates, and more to aid in rapid wireframe production and quicker ideation.
Why Spark over any other design library?
We’ve architected Spark to aid UX designers specifically. Here’s how:
Single Element Focus
Spark was designed around a building block mentality, providing a vast assortment of elements to rapidly compile a screen. We stayed away from the urge to create realized page blocks such as headers or feature areas, since frameworks that accomplish this type of need are readily available.
Nearly all other Sketch UI kits are focused on visual design and specific themes, but Spark is set in grayscale to remove the need to convey a specific design language.
Responsive and Customizable
99% of Spark is responsive and override enabled, so you can customize your elements to best suit your project’s needs.
What kind of stuff is in Spark?
We have jam-packed Spark full of everything you need to jump-start UX projects. We’ve broken down everything into major categories so you can access what you need faster. Here’s a quick rundown of what we have:
- Basic Components - Contains a huge variety of cross-platform and device-agnostic components
- Android Components - UI for Android apps based on Material design
- iOS Components - UI for Apple devices based on iOS 11/12 SDK
- Charts - Commonly used charts for quick insert
- Flows - Responsive symbols to create user flows and documentation
- Form Fields - Commonly used form field items. States and icons within fields are manipulatable.
- Icons - A subset of Font Awesome 5.0 icons in vector format, listed alphabetically
- Templates - Prepackaged form templates for common cases, such as login and address collection
- Typography - Preset font styles in white, gray, and black, as well as all three alignments
- Basic Styles - A scale of 5 grayscale options, and some basic colors for element states
You can preview all of this on Sketch Cloud: https://sketch.cloud/s/OWyMp
How do I get it?
You can add the library to your projects or download the file to your computer from our link on Sketch Cloud: https://sketch.cloud/s/OWyMp
What if I want to contribute to Spark?
Got an idea to make Spark better? See a bug in the project? We would love your suggestions and help maintaining it!! We’ve released Spark under the Creative Commons license and opened the project on Github.
Join the project, and help us make this into the ultimate UX designer’s resource: https://github.com/jessewallace/spark
Why release it for free?
At Dragon Army, we believe in Inspiring Happiness by Doing Good. We felt this was a great way to give back and put a smile on the faces of those that have been looking or waiting for an affordable (or really ANY) framework for their wireframes.
We had some awesome help.
Spark got a great injection of resources from the following amazing authors:
We hope Spark makes your designing a little faster, a little easier, and a little more fun. If you have any questions, please feel free to reach out directly at [email protected].
Written by Jesse Wallace, Sr. User Experience Designer at Dragon Army
Twitter Handle: @jesse_wallace