Tilt is a UI kit designed to provide inspiration for your projects while guiding smart interactions. It is a design guideline that was meticulously created and designed to be simple and striking. Using depth, this visual styling uses shadows to create a three-dimensional feel as its key method of depicting informational and interaction hierarchy. In prototypes, accelerometer information can used to create a “tilting” parallax affect on elements to depict depth. Please note that this kit is meant to work as a library of design patterns and components to work as more of a guide to interaction and visual design.
Along with depth, key information is made easily visible by using bright contrasting colors against a light and low-intensity color palette. The color palette was selected carefully to balance contrast and make informational hierarchy quick and easy to understand, so it’s recommended that you follow the suggested shade formats that are included.
Tilt is also built for prototyping. Every component is smartly grouped and easy to export. The download packet contains Pixate prototypes as well as assets to build prototypes for the default designs. To learn how to build these prototypes, I've uploaded a dedicated tutorial teaching you how to bring the design to life as intended. Of course, I'm excited to see your own interpretations of the feel of the app. You can find the tutorial on YouTube.
If you have any questions, comments, suggestions, or find any errors, drop a comment or reach out to me @jaredlodwick!
I hope that you like this free resource. If you do, I would appreciate it if you tweet and share it! Follow me to keep up to date on all future resources first!
L or F like
Show and tell for designers
What are you working on? Dribbble is a community of designers sharing screenshots of their work, process, and projects.
© 2019 Dribbble. All rights reserved.
Almost Sold Out: Hang Time Workshops with Jon Contino, Danielle Evans, and MDS.
Minimum 6 characters
Uh oh… We’re still waiting for our spam prevention code to load.