Hofmann UI Kit by Elias Bikbulatov
Hofmann is the responsive UI Kit for Sketch app. It was created to help designers start with designing promotional pages, landing pages and simple front pages with the basic elements. It contains different versions of common used sections such as headers, call-to-actions, testimonials, pricing, contacts, footers and so on.
The design is adapted for 3 resolutions of popular Bootstrap breakpoints. It also contains baseline grid, so all elements are nested into the grid. This project is free to use, so anyone can download the source files for personal and commercial use.
Elias just wanted to try with UI Kit, and he saw many great examples that inspired him. The main idea was to make it responsive, so he have to create three layout versions instead of one. The colors was chosen because he just like the combination of golden tints and some shades of gray. In first variant it was only two colors.
Elias also used some icons that he have created for another project. For typography Elias have used free Google Fonts. It was Montserrat for headers and Source Sans for paragraph text.
- Elias Bikbulatov
Elias used Sketch app because it is his favorite tool for UI. He also used the photos from Unsplash generated by InVision Craft plugin for Sketch. Craft was very helpful to generate not only the images, the placeholder text and person names are also generated with Craft.
Elias started with choosing fonts and color palette. Then he tried to make some simple layout for desktop resolution. Then he has calculated the grid for baseline and typographic scale and adapted it for all resolutions. When sample pages was made, he started to make all sections in different versions. When all main elements was done, he put them into the style guide page.
Elias started to create project in leisure, but it was finished in rush. he decided that everything must be done in two weeks, and then he must turn to other projects.
- Elias Bikbulatov
The reaction on this project was warm. Elias received thanks for this freebie and people appreciate it and added it to their collections on Behance. He like to see his work on websites that he usually visit. Thanks to design ideas for invite.
This project helped me to start think far. Elias would like to create some similar projects in the future. He would like to create UI Kit for mobile application, and it would be great to create wireframe kit.
For now he is working on my icon set project, that contains more than 500 icons. For now he improve the quality of all icons, so Elias edit every icon manually.
He is also working on some freelance projects.
- Elias Bikbulatov
About Elias Bikbulatov
UI/UX designer focused on creating web and mobile applications, icons, wireframes and UI graphics.