Building the Get Shit Done Pro Kit

Over the last couple of months we have been working on the Get Shit Done Pro Kit. It is the best, most creative and customizable item we have ever released. Most importantly, it solves many of the needs that designers and developers have these days building beautiful products: moving from PSD files to HTML, keeping a consistent line of design, developing multiple options in the same time and creating awesome stuff!Developing the kit proved to be a journey harder than how we first imagined it, though we didn’t lack enthusiasm or resources. So, we thought it could make for an interesting read both for people looking to do their own products and those using kits.

How We Built It

We started building the Kit thinking end user experience first, easy to integrate product second and our own comfort somewhere very far down the line. Above all, we wanted a product that looks and feels great to use. Web design is a very intricate field and everyone involved can test to the fact that scaling it requires certain skills.

Building an UI Kit first involves laying the basic rules that every component will follow. In the case of the Get Shit Done Pro, the ground work was covered by Twitter Bootstrap and our previous free version. Even so, going into more complex elements required constant focus. In the end, looking through the Kit you will see everything seems to fit together: from cards to tables to Javascript plugins.

One of the most important pitfalls we faced is not doing every variation of every element. More simply: constantly reinforcing the mantra of ‘Less is more’. Adding multiple elements doing the same thing is quite simple, but getting to the essence of a function and look of an element is much harder. If you take any element from the kit, you will see it serves one function the best way possible.

We took the best examples from the web: from blogs, e-commerce, startups and other websites that actually serve a purpose. We made it so you will easily find your way around any use case. For example, if you are looking to build a blog, all elements are there: you have the cards, the typography, images, header, footer, testimonials, etc: you just have to choose your own varitaions. How did we get to them? By looking at the best examples, such as Medium, Ghost, SquareSpace, The Next Web and making them beautiful and consistent with the Get Shit Done design.

How You Can Use It

Building your own product

If you are a start-up person, the kit could be the best thing you will find for your web development. It is an order of magnitude easier to build using Twitter Bootstrap and our kit, than it is to go from the bottom up. Focus your resources on solving the unique problem you are solving and raising your business! The Get Shit Done Pro Kit will help you cut costs, save time and have multiple iterations that look consistent.

Building for clients

If you are a freelancer or an agency working with various clients, you will find the Kit to be useful. The PSD elements can help you get a prototype ready in no-time. After getting client feedback, you can continue to iterate or translate your work to HTML/CSS files very quickly. Every element from the PSD files has an HTML counterpart, making it much easier to get your site or application up and running.

Building themes and templates

If you are building themes or templates, the kit is something that you should definitely have! The variations that the elements offer are endless and they are all looking good. Ranging from blog templates to corporate landing pages, your creation process can have more speed and consistency.

We consider the Get Shit Done Pro to be a very important step towards creating better web experiences. We want it to become a standard for great design and can only do so by getting constant feedback. Be sure to let us know what you think!