Tobia Crivellari on Designing with Sketch
Tobia Crivellari was born and raised in the small town of Rosolina close to Venice, Italy. He currently lives in Berlin and works as the Lead Designer for Bonagora, a B2B platform for home fashion wholesale. He focuses on design for Android, iOS as well as Bonagora’s web app.
Tobia started out designing a long time ago, first by creating artwork from mixing colors, creating shapes and using pictures, and blending modules in Photoshop. After a while, his interest started shifting towards the technical aspect of design and he became very passionate about designing user interfaces.
“I began to learn by replicating what other designers were doing to understand how they came up with such amazing and cool stuff. I also started creating my own personal style and UIs. From that point on, I was improving my skills on a daily basis. At that time, I didn’t even think this could become my full time job. It began as a passion and became my career, it’s awesome.”
Tobia shares how Sketch and other tools improve his workflow and what his favorite plugins are. He provides valuable tips on starting out with Sketch and on designing for different interfaces.
What are some of the tools you use in your daily workflow?
About seven months ago I switch to Sketch and I won’t go back to Photoshop for UI design. I started designing with Sketch and I found the whole process of UI design easier and faster. After a week of practicing I was able to do everything that I was able to do in Photoshop… and much better! So right now I use Sketch all the way for UI design.
In a nutshell: for creating static mockups and static states for the UI, I use Sketch. To create icons, I use Illustrator and for creating prototypes, I use mainly Principle and Pixate. Regarding team communication, my platform of choice is Slack. For project management I use Trello.
What part does Sketch play in your design process?
Sketch plays the main part when it’s time to create pixel perfect mockups and different states for an app or a web project. It is also a great tool for iteration on final mockups itself because it’s fast to create different Pages and Artboards that include multiple versions. You can present a final version of your Layout and thanks to Symbols and Text Style, you can change elements pretty easily. It also plays a main role in creating assets for prototyping and animation. You can export the final assets – and see how they will really look as the final product – and create a prototype pretty close to the real app. And of course it plays a great role in exporting assets for developers.
What are your favorite features and/or plugins?
I use a few Sketch Plugins, such as the Content Generator that helps you fill up your UI with names, avatars, descriptions and details of all kinds. I started to use Zeplin to provide specifications on color, margins, style, and so on to our iOS developers. I also use Unsplash It when I am looking to create beautiful UIs with beautiful visuals. I also occasionally use Scripts that helps you modify shapes and create blend steps.
Who or what inspires and influences your work?
Generally for me the most inspiring websites and apps are the ones created by Google. I love Google design! Regarding the website and the apps I would say that Google Maps, Google Calendar and Google Mail are my top 3, especially as mobile apps. The way that the Google team designs and makes the UI work is something unique that really inspires me.
Any best practices you can share about designing for different interfaces?
Well, it really depends on which devices you are design for. If it’s a website it’s a common practice to design starting from the smaller size device that your website will be seen on, then go up to the desktop version. This allows you to focus on the main content on the website. If you’re designing for a mobile app, I always start design @1x because then it’s easy to scale up assets if you need or communicate sizes, margins, and so on to developers. I also feel that it’s better to design @1x because you don’t have to calculate every time if you’re designing @2x or @3x. If it’s a web app, then it’s a little bit different. I would say that it’s a mix of the two mentioned above: design at the smaller size (if you support also a mobile version) and @1x.
What projects are you most proud of?
I worked on a few challenging project in the last few years. One of the projects was at the first company I worked for in Berlin. The app was called Tunedin, a second screen app with heavy social components. At that time only the iOS version was planned, and I got the opportunity to translate the app for Android. I clearly remember that I was super confused on the whole set of screens that we had to cover in order to have a good presence on the Android platform. It was a nightmare! I’m talking about couple of years ago. Right now it’s far easier.
The project I’m currently working on, Bonagora, is the most stimulating and challenging so far. First, the app is for web as well as mobile devices: Android and iOS. The challenge for me is translating a mobile app into a web app.
The app is also pretty complex. It’s a business app so there isn’t too much room for entertaining UI. The UI needs to be clear, clean and very well structured.
Additionally, the challenge I’m faced with is to keep the experience consistent between the three platforms: Web, Android and iOS. I’ve to say that it’s pretty fun, it allows me to get to understand thoroughly every single platform and come up with design solutions that unify the UX between them.
I’ve also had a chance to work on a few side projects. The first app that I’ve re-designed and is available in the App Store - FoodQuest. And two projects that I build from scratch and are still in development - Brandnew and HRbox.
What resources would you suggest for those that are just starting out with Sketch?
For someone that is just starting to use Sketch, I recommend to begin with checking out the resources listed on the Learn page, especially the course by Christopher Downer in collaboration with Treehouse - it’s very useful for beginners. Other than that I would suggest to play around with designs in Sketch, using the workflow you are accustomed to. After a week I’m pretty sure you’ll be ready to integrate Sketch in your workflow pretty easily. That’s how I did it! :-)
Are you part of any Sketch communities?
I’m part of Sketch App Sources which is a big community of designers that contribute their work for the benefit of growing the Sketch community and learning from one another. You can see one of my recent contributions below and you can find more here. I also participate in Team Sketch Slack Group, where designers share tips, plugins, designs, and resources.
What other things do you enjoy doing?
Beside design I really enjoy watching movies. Movies are my other passion. I love go to the cinema, grab popcorn and a coke… lay back and relax watching a new movie. Even better if it is 3D or IMAX. I also really like to listen to music, enjoy new tech gadget and read about new technology that is being build.
Thank you Tobia for sharing your design experiences and advice with us. We are happy that Sketch is such a big part of your design workflow! You can find Tobia on Twitter and Dribbble.
