Mastering Interaction Design through Craft, Productivity and Workflow
An interview with Johny Vino, #1 UpLabs designer
--
As UI design gets more interactive, new skills and faces emerge to give us a lesson on how to get animations and movement right when creating delightful screens for rather little devices. To understand how to achieve these small but effective moments of user satisfaction, we’ve talked with Johny Vino, one of UpLab’s masters when it comes to sleek animations.
If you’ve been around UpLabs for a while, Johny Vino’s name won’t sound new to you. He’s been constantly delivering amazing UI designs since he joined the community. His work is extremely popular: he’s finished #1 on UpLabs 120 times (to date!) and he’s ranked as the #1 designer among the 200.000+ amazing designers contributing daily. You can check his fantastic stats and medals on his profile!
Impressive numbers aside, we wanted to explore together with Johny his day to day life and how he keeps his workflow and productivity always high. He agreed to an extensive interview with us and we couldn’t be more grateful for his time, tips and insights. Happy reading!
Hi Johny! Could you briefly introduce yourself?
Hey, I’m Johny Vino. I currently live and work in Bangalore, India. I am a self-taught designer who studied Electronics Engineering. My absolute biggest passion is Design, but I also have love for architecture and traveling.
Where do you work?
I am currently a Product Designer working in Tekion, a company started by Tesla’s former CIO. On top, I am also working on my personal project called “Best Mobile Interaction series” — it’s a repository of all achievable mobile interaction solutions, which I hope will benefit novices entering the Interaction Design world.
How did you become a designer?
Starting at the age of twelve, I have spent myriad of hours on sketching my ideas. Later on, I got truly excited by the field of Human-Computer Interaction. I guess it’s because I consider it the intersection between psychology, design, and technology.
I have distinct interest — architecture, design, culture, fashion, etc. and each field has its uniqueness. Nevertheless, all of those fields have a common characteristic — they all aim to find the best (and most beautiful) solution to a problem. No matter which kind of product we are making, that product has to solve a problem for the user or improve some aspect of the user’s life. For me, understanding the user’s mind is the most significant factor when it comes to product. Therefore, I would like to concentrate my career into solving problems for users and designing solutions to enhance people’s lives.
Still, I don’t think my path to become a designer is finished — I believe in a field like Design, we all should keep educating ourselves and learning every single day. That is why I’m enrolling this fall into the SVA, the School of Visual Arts MFA, in the Interaction Design program. I’m very excited to move to NYC to get my Masters Degree and keep doing more research on Interaction Design!
That sounds incredible, congratulations! Could you share with us how’s the life of a designer in India?
In my opinion, it’s exceptional. I think I am living in the right place at right time, and that surely is key to being successful in this field. Nowadays, the world has become extremely competitive, you have to make things happen every day, meet people, create contacts. Everything goes so fast thanks to the Internet and smartphones, which can get very overwhelming.
But on a positive side, that also means you can exhibit your talents through social media quickly, and communities like UpLabs help the magic happen between designers and beyond. Thanks to online communities, everyone in the world can get noticed, no matter where you are based. For me, your progress in this field comes with experience, hard work and the support of your network, offline and increasingly, your online community. So living in India and being able to reach my peers here and around the world is just perfect.
What tools do you use the most to design, prototype, select your colour palettes and so on?
For designing, I am using Sketch, which is, in my opinion, the most productive tool in terms of endurance and pace of creation. For prototyping, I am using mostly Principle and After Effects.
It’s been a process though. In order to learn Principle, it took me at least two days. I have tried many prototyping tools like After Effects and Flinto, and I consider both exceptional software. But with them you usually need around 30 minutes to create an animation that you can do in 10 minutes using Principle.
When it comes to colour palettes, I tend to select by myself according to the latest trends in relevant industries for the project. Before starting the UI, I make sure to decide on the hierarchy of colours that needs to be used.
Do you use any plugins?
About plugins, Zeplin is the only one I am really using. I want to keep it lean, I don’t use plenty of plugins and software that will immensely reduce my speed.
Do you have a certain design process that you follow consistently?
Every project is a bit different, but in general, this is my path:
1.Think of the design problem I’m facing. I try to find the best solution using my experience as a designer but I also always ask my associates, who can see the problem through another light.
2. Sketch my initial take on the problem and my inspiration in the handy white board.
3. Take sticky notes and jot down what are problems I’m discovering along the way, and how to solve them through interaction.
4. Do an initial UI design in Sketch. I take the rough layout I have drawn in white board and then I start polishing the UI digitally.
5.Start the interaction design using Principle with all the ground work done by now. As you can imagine, this is the part I enjoy the most!
6. Export the .MOV file from Principle and then import the .MOV to Photoshop. I crop the length and finally I get to export my prototype in GIF format.
7.Only thing left to do is to publish the final result on Uplabs! I usually submit once a day and it always brings me joy to get immediate feedback from fellow designers. It definitely keeps me motivated to submit more of my work and it helps me learn what gets traction and gets users excited.
That sounds like a great workflow! Could you walk us through the creative process behind some of your most upvoted animations on UpLabs?
For sure! Usually it all starts with a sketch on a white board with lots of annotations and post-its. Here a few examples that show how things start and where they end:
Seeing your final results, it’s no wonder that your stats on UpLabs are so impressive. Could you share some techniques or tricks that help you keep submitting amazing designs that get consistently showcased?
I’d like to answer with a few quotes that inspire me daily, but also with actionable advice that I think can help designers who want to get more exposure on UpLabs.
“There is no secret at all, our mind is everything. What we think, we become.”
1. Don’t Be Afraid To Innovate: Structure is essential, but you should always explore different layouts and colours rather than always following someone else’s rules. I myself don’t believe in blindly following rules. Put your innovation and creativity first to make your design stand out from the crowd.
“I have never in my life learned anything from any man who agreed with me.” — Dudley Field Malone
2. Stop waiting for perfect circumstances to launch a great project. Launch your ideas often, even if right now doesn’t feel the perfect timing because of external reasons. That also helps you to be more prolific and stay inspired all the time. People usually link productivity to focus in one single idea, but I’ve experienced that many times different ideas end up converging in one that integrates them all. Also, when you have launched different initiatives, you can compare them and see which one stands out and sticks into other people’s minds. That helps you to see the path more clearly.
3. Establish quality in all that you do. I find this very important. Otherwise, your fans get disappointed and that will directly affect your credibility. You can ask for feedback early on when things are still not perfect, but try to aim for the best result when you hit export (or submit on UpLabs!).
4. Be persistent and work hard to deliver the best design. I feel I get better every time I work in a new project. As designers, we are not far away from craftsmanship, even if our work feels very techie sometimes. Practice makes perfect, and as I have written in my desk:
“Hard work beats talent when talent doesn’t work hard” — Tim Notke
Tell us, how do you find your inspiration and keep up to date with the latest trends, tools and techniques?
In general, I find inspiration comes somehow from within:
“Instead of expecting more from others, expect more from yourself. Stay as an inspiration to others rather than constantly looking for inspiration.”
But of course, there are several blogs I read daily, I listen to numerous podcasts and subscribe to tons of newsletters. But first, I’d say that it is important to ensure that you don’t overdose on information and learning process. That will waste your precious time. Follow 80/20 rule always and take influence on 20%, practice on 80%.
Here my favourite tips regarding inspiration and resources:
#1. Install the Muzli 2 — Stay Inspired Chrome Extension— you spend a lot of your time constantly opening up new tabs, so why not just make your ‘New Tab’ show you all the latest work from what’s popular today.
#2. Visit Designer News daily — stay up to date on what other designers are talking about.
#3. Subscribe to Sidebar— which offers you curation of the top 5 best articles in that specific day.
#4. Save UpLabs in your smartphone as a mobile app — when you’re at the metro station or waiting in the hotel for food, instead of seeing what’s going on in your Facebook or Twitter news feeds, open up a the UpLabs and get small doses of inspiration in your in-between time. The site is fully responsive and it is easy to bookmark it as an app that you see constantly in your smartphone’s home screen.
Excellent tips! To wrap it up, our most pressing question and what everyone in the UpLabs community wants to know: how you keep your productivity so high all the time?
For me, productivity is not about finding the time, but making the time. I always think about this quote:
“Either you run the day, or the day runs you.” — Jim Rohn
But I would suggest that these aspects are key points to my productivity:
- Plan each day the night ahead.
- Keep your goals.
- Put 20% effort every day on your goals. You can still make great progress if you have only spent 90 minutes on your goals every day.
- Trim your workplace.
- Don’t get up at 5 am if you will feel sleepy, but do wake up at 7 am and focus on your life goal first.
- Get lost. Don’t be so available to everyone.
- Mute your WhatsApp notifications.
- Avoid productivity killers such as social media and email. Allot 1 hour every day for them and only use them on the allocated times. It will help you to stay focus (and to recover from our global addiction!).
Oh, not all of them so easy to do, but all of them truly wise advice. Thank you for answering all our questions!
Oh, it was my pleasure! I hope I could bring something positive to your life and your design mindset. If you wish to know more about my work philosophy, you can reach me on UpLabs and on Twitter.
More about Johnyvino
My name is Johnyvino. I live and work in Bangalore, India. I work as an UX and Product Designer at Tekion, a company started by Tesla’s former CIO. I am a self-taught designer who studied Electronics Engineering — so despite my technical background, I can say today that Design is my true love.
Follow Johnyvino on UpLabs, Twitter, Behance and Dribbble.
UpLabs curates the best resources to help you create awesome apps and sites, daily. Check out today’s showcases on UpLabs!
If you enjoyed this interview, please show us how much with as many 👏🏼👏🏼👏🏼⤵ as you wish — don’t be shy! This is how you help other people discover our best articles. We are clapping right back at you!
