articles on

UI Inspiration: This week's selections from Willie.H, Arnar Ólafsson, Zak Steele-Eklund and more

UI Inspiration: This week's selections from Willie.H, Arnar Ólafsson, Zak Steele-Eklund and more

It's that time of the week for our collection of UI/UX interactions to boost your UI inspiration. We are focusing on cool animations, layout designs, UX thinking and more. We will mix it all from static, dynamic and even live prototypes, this might be a great article to bookmark! For this week, we have some cool interactions with a recipe app concept and a very intuitive animation for a freelancer app on meetups. In this collection we are featuring the work from Willie.H, Arnar Ólafsson, Zak Steele-Eklund, Anton Aheichanka and more. More Links For more, check out Dribbble Follow my tweets @aoirostudio Follow my pictures on Instagram via Dribbble Design by Anton Aheichanka Design by Martin Strba Design by Willie.H Design by Pawel Waraksa Design by Arnar Ólafsson Design by Minh Pham Design by Zak Steele-Eklund Design by Andrew Aquino Design by Stugbear Design by Cuberto Design by Kane_D Design by CANAAN Design by Ramotion Design by Zoeyshen Design by Johny vino™ Design by Ales Nesetril Design by ∆ Studio–JQ ∆ Design by Hrvoje Grubisic Design by Lukáš Straňák Design by Matteo Pasuto Design by M S Brar

UI Inspiration: This week's selections from Virgil Pana, UI8, Tubik and more

UI Inspiration: This week's selections from Virgil Pana, UI8, Tubik and more

It's the weekly moment for our collection of UI/UX interactions to boost your UI inspiration. We will focus on cool animations, layout designs, UX thinking and more. We will mix it all from static, dynamic and even live prototypes, this might be a great article to bookmark! For this week, we have two "error" animated prototypes from UI8, a smooth interactive mobile design of a watering tracker app and a lot more. Hope you will enjoy! In this collection we are featuring the work from Virgil Pana, UI8, Tubik, Divan Raj and more. More Links For more, check out Dribbble Follow my tweets @aoirostudio Follow my pictures on Instagram via Dribbble Design by Virgil Pana Design by UI8 Design by Tubik Design by Virgil Pana Design by Divan Raj Design by Divan Raj Design by Aurélien Salomon Design by Tubik Design by UI8 Design by Aurélien Salomon Design by Suthan S. Design by Divan Raj Design by tubik Design by Outcrowd

Interaction Design & UI/UX: A closer look at the Tesla Model 3 touchscreen

Interaction Design & UI/UX: A closer look at the Tesla Model 3 touchscreen

I am a great fan of Tesla and also of Elon Musk, the care of his level of thinking for the user experience and vision simply changed the game of the entire car industry. Earlier this year, they have introduced the Tesla Model 3; the mid-size all-electric four-door luxury sedan starting at a very affordable price. As a designer, what struck me the most was the removal of the "conventional" interior car interface replaced by a 15-inch touchscreen. So many thoughts went through my mind regarding how the driving will be effective with such a large screen in the center console. We are taking a look at the work of Michael Cherkashin, a Los Angeles-based creative director at HUG. He is walking us through the original concept and also all the challenges they have encountered for designing the interface of the Model 3. Enjoy the read! Michael Cherkashin is a creative director over HUG. A branding agency on a mission to rely on for beautiful design and impactful outcomes. Based in Los Angeles, CA, USA, Michael is also Director of photography at Inhale Films. Our vision for any user interface is simple: efficiency should be as close a possible to 100%, in other words, a user should be able to perform the desired task with as little effort and distraction as possible. This would be especially pertinent to vehicles as safety is such a priority. We want to share this philosophy with drivers, fellow engineers at Tesla and other car manufacturers. We've designed intuitive multi-touch gestures and a responsive grid that can be customized to suit both driver and passenger needs. More Links Learn more about Michael Cherkashin at hugagency.com Follow Michael Cherkashin's work on Behance UI/UX & Interaction Design (In His Words) Challenges Model 3 has been released with a new 15-inch touchscreen, which is wider than previous screens on Model’s S and X. Whilst it looks great, some areas of the screen and functionality have become harder to reach. This may seem like a minor difference, however, when operating a vehicle it could become significant, as every moment is crucial. And, although the Model 3 was designed to be autonomous, in some countries, with heavy winters for example, the necessary infrastructure and support is yet to be in place, so the need for a driver in an autonomous vehicle is still required. Another challenge arises from the lack of physical buttons. In other vehicles your tactile sense can be used to find the button or adjustor without taking your eyes off the road. However, navigating a touchscreen requires the driver taking their eyes off the road; when encountering bumpy roads, it would be even more challenging holding a steady hand on the right area of the screen. To combat this we came up with two solutions. The first is an adjustable grid where users can move panels of the dashboard to best fit their needs. For instance, the media player can be moved to the passenger's side so they can enjoy playing DJ, whilst the map can be moved in closer view to the driver and expanded or hidden in case of autonomous driving. The second solution introduces multi-touch gestures that can be applied to any area of the screen, and don’t require a driver to be distracted by looking away from the road to navigate functions. These gestures would be intuitive and replicate physical buttons. Video Two Finger Gestures Using two fingertips, drivers or passengers can control the multimedia player, even when it’s not displayed on the screen. Each gesture has been designed to replicate the physical buttons and dials we’ve become accustomed to, for example, the volume wheel rotation. • Tap to play and pause • Rotation brings up the volume • Tap and scroll sideways to fast-forward • Quick scroll sideways to change media • Scroll top and bottom to change channels Three Finger Gestures Using three fingertips, drivers or passengers can adjust climate control by rotating left or right. When adjusted from the driver’s side of the screen, the temperature is controlled for the whole vehicle; alternatively, applying the same gestures from the passenger side enables dual climate control. • Rotation on the driver’s side controls temperature inside the whole vehicle • Rotation on the passenger's side turns on and controls dual climate control • Scroll top and bottom to adjust fan level Interface Look and feel is another key factor to consider, especially in such a beautifully designed Model 3. The interface should match the quality interior and exterior. We used a simple and smooth design, with a very friendly and warm feel. The buttons are large, with plenty of surrounding space so it’s easy to tap while driving. The colors are balanced to be clearly visible in bright sun, but soft enough to be less distracting for the driver. Night Mode Once the sun starts to set and night falls, the screen will switch to a darker night mode, providing less glare and distraction for a better driving experience. The brightness level is adjustable by moving one finger down from the top edge to decrease the light, and up from the bottom edge to increase the light. Notifications Notifications are made to be intuitive and easy to deal with. For example, whether you are mid phone call or cruising along, when your vehicle’s battery is running low the option for taking direction to the nearest Supercharge station is one simple touch away.

UI Inspiration: This week's selections from Outcrowd, Nicola Baldo and more

UI Inspiration: This week's selections from Outcrowd, Nicola Baldo and more

This is now a thing! We are starting a weekly UI/UX interactions collection for your UI inspiration. We will focus on cool animations, layout designs, UX thinking and more. We will mix it all from static, dynamic and even live prototypes, this might be a great article to bookmark! For this week, I noticed how designers love using the iPhone X mockup, it's quite nice actually. Let's keep embracing that notch! In this collection we are featuring the work from Outcrowd, Nicola Baldo, Gal Shir, Michał Roszyk and more. More Links For more, check out Dribbble Follow my tweets @aoirostudio Follow my pictures on Instagram via Dribbble Design by Outcrowd Design by Nicola Baldo Design by Gal Shir Design by Michał Roszyk Design by Cuberto Design by tubik Design by Hwatery Design by Daniel Kerris Design by Quintin Lodge Design by Mario Šimić Design by Piko Rizky Dwinanto Design by Miaomiao Design by Dawid Sobecki Design by Anton Avilov

Web Design Layout Collection by Creative Mints

Web Design Layout Collection by Creative Mints

After a long Weekend of rest, I thought we should start it all with a burst of web design inspiration. A collection really well-designed by Prague-based design boutique Creative Mints. A great balance of typography, layout, and colors; somehow quite different from the usual "guaranteed approaches" and stock photo gallery designs we are seeing lately. It's great to understand the UX of things but it never hurts to also put an accent on the playfulness of your designs. Located in Prague, Czech Republic, Creative Mints is a design boutique with projects focused mainly around illustration, UI/UX and Graphic Design. We really do enjoy their work on ABDZ, make sure to check out their Behance. More Links Learn more about Creative Mints at creativemints.com Follow Creative Mints's work on Behance Web Design  

UI Inspiration: More Hand-picked UI/UX Interactions

UI Inspiration: More Hand-picked UI/UX Interactions

I guess it's that time of the week with an article all about more hand-picked UI/UX interactions. You guys are suggesting we should do this as a weekly thing? Let us know! We would love to get your insights! Let's go again with another collection of UI Inspiration that I've come across on via Dribbble. I tried to mix it all today from static, dynamic and even from a live prototype. We are starting to notice designers embracing "the Notch". In this collection we are featuring the work from Jurre Houtkamp, Manoj Rajput, Vishnu Prasad, George Vasyagin and more. More Links For more, check out Dribbble Follow my tweets @aoirostudio Follow my pictures on Instagram via Dribbble Design by Manoj Rajput Design by Adam Tolman Design by Slava Kornilov Design by Vishnu Prasad Design by George Vasyagin Design by Bobbi Z Design by Jurre Houtkamp Design by Kate Laguta Design by Daniel Tan Design by Miro Koljanin Design by Kostya Vargatiuk Design by Yury Smirnov Design by Vladimir Gruev Design by Bart Ebbekink

UI/UX: "Realistic" 3D Weather App

UI/UX: "Realistic" 3D Weather App

I guess weather apps are part of what we would qualify part of our daily routine, personally I related myself to Google Apps. But they are a numerous amount of applications out there that shares a "fun" factor to the mix. We are taking a look at the RealWeather app from Poland-based designer Michał Sambora. Adding a semi-realistic 3D renders to the minimal UI, this app concept definitely gives the prime to the 3D merging together with a dark UI all across. Michał Sambora is a mobile UI/UX designer based in Krakow, Poland. We have featured his motion work before on ABDZ. Make sure to follow his work and experiments on Dribbble. Fresh concept I had back in January for very simple and clean weather app with realistic 3D weather conditions.. Doesn't matter if there is plenty of such already, had to try to make those lovely clouds and animate them in Houdini and C4D + Octane myself :D Credits to Josef Bsharah (http://www.josefbsharah.net) for inspiration and helping making it happen! More Links Learn more about Michał Sambora via Dribbble Follow Michał's work on Behance UI/UX  

UI Inspiration: Some more Fresh UI/UX Interactions

UI Inspiration: Some more Fresh UI/UX Interactions

We had a pretty good response from last week's article about fresh UI/UX interactions. You guys are suggesting we should do this as a weekly thing? Let us know! We would love to get your insights! Let's go again with another collection of UI Inspiration that I've come across on via Dribbble. Happy Friday, let's keep the spark! In this collection we are featuring the work from Virgil Pana, Divan Raj , Leo Leung, UI8 and more. More Links For more, check out Dribbble Follow my tweets @aoirostudio Follow my pictures on Instagram via Dribbble Design by Tintins Design by UI8 Design by Virgil Pana Design by Divan Raj Design by Cosmin Capitanu Design by Virgil Pana Design by ⋈ Sam Thibault ⋈ Design by Gene Ross Design by Divan Raj Design by Leo Leung Design by Tubik Design by Divan Raj

Brand Identity & UI/UX: Behance Studio Desktop App Concept

Brand Identity & UI/UX: Behance Studio Desktop App Concept

We would like to share this brand identity that involves also UI/UX for a desktop app concept based on the very popular design platform to showcase and discover creative work. Introducing the Behance Studio by Moe Slah. It's a take on the desktop user experience from creating your project and uploading it all to Behance. It's a pretty simple flow but one thing I had in mind is how the sync will work compared to what's already online. Can you still surf on Behance?! What do you guys think, let's dive in first. Moe Slah is a Egypt-based digital creative director. We have featured his work before on ABDZ. Make sure to check out his Behance for more of his delightful portfolio and concepts. Behance Studio is a desktop application for behance showcase network, you can design your project presentation easily and smoothly as you are using photoshop or any design desktop application. More Links Learn more about Moe Slah at moeslah.co Follow Moe's work on Behance Brand Identity & UI/UX  

Interaction Design & UI/UX: 10Cool Projects with 10Clouds

Interaction Design & UI/UX: 10Cool Projects with 10Clouds

We have featured the branding redesign from the kind of from 10Clouds on ABDZ. Let's now take a look at their actual work that involves UI/UX, Web Design and Interaction Design. The series is called: 10Cool Projects (Get it?!), it's a mixture of different projects including an email app, museum app, events app and more. That's definitely a good link to bookmark for your inspiration. 10Clouds is a team of 100+ experienced developers and designers, ready to help you build your web and mobile applications. Check them out on Behance. Selected user interfaces More Links Learn more about 10Clouds at 10clouds.com Follow 10Clouds's work on Behance Photography  

Web Design & UI/UX: Lionsgate Pitch Concept

Web Design & UI/UX: Lionsgate Pitch Concept

I used to be a great fan (and still) of pitch concepts, it's such a great exercise to do with your team or even with yourself. The goal is to attract a client for project by getting out of your comfort zone with an idea and going through the whole design process. I love it because you get to experiment ideas or even try concepts that you wish you could have done on another project. We are taking a closer look at the work from Rolf Jensen for a pitch he had to work on for Lionsgate (in collaboration with Real Pie Media), I love how the background colour is part of the UI where buttons aren't adding an additional foreground colour. It almost feels like an app but through a web experience. Check it out! Rolf Jensen is a freelance interactive director based in Lower East Side, New York. We have featured his work before on ABDZ, please check him out on Behance. These visuals are pulled from a design pitch I created for Lionsgate and Real Pie Media in LA a while back, yet this is some of the most recent work that I was able to show publicly this year, but more to be shared soon. More Links Learn more about Rolf Jensen at rolfjensen.no Follow Rolf on Behance Via Instagram  

UI Inspiration: Some Fresh UI/UX Interactions

UI Inspiration: Some Fresh UI/UX Interactions

Something we should do more often and not enough; getting immerse into a surf on Dribbble. I just had one yesterday night and I was just impressed about all the amazing work by many talented designers out there. I've put together a collection with a mix of design and interactions for your UI inspiration. Sometimes I do forget how it's great to just get a spike of inspiration for your current workflow or project. It's always needed and adding so much value. Hope you will enjoy this! In this collection we are featuring the work from UENO, tubik, AgenceMe, UI8 and more. More Links For more, check out Dribbble Follow my tweets @aoirostudio Follow my pictures on Instagram via Dribbble Design by Virgil Pana Design by Jenny Johannesson Design by Clara Rua Design by Gene Ross Design by Jenny Johannesson Design by tubik Design by ⋈ Sam Thibault ⋈ Design by tubik Design by Barthelemy Chalvet Design by Divan Raj Design by Leo Leung Design by UI8 Design by Divan Raj

UI Interactions: A Collection to Bookmark by Divan Raj

UI Interactions: A Collection to Bookmark by Divan Raj

Let's finish off this week with a cool collection of UI Interactions by India-based designer Divan Raj. It's a set of exploration and experiments that will cover all aspects of interactions from web design and app design as well. Even though most of us think about interactions near the end of our process, I feel it's always a good thing to have your library refreshed and open to any new concepts. Let's bookmark this one gang! Divan Raj is a freelance designer based in Bangalore, India. You should definitely follow his work and experiments via Behance and via Dribbble. Interaction Gallery   More Links Learn more Divan Raj via Behance Follow Divan's work on Dribbble

Stylish UI Design for Nike SB Concept Project

Stylish UI Design for Nike SB Concept Project

We have featured Side B projects in the past here on Abduzeedo. We like to diversify but they really got me by creating an beautiful UI Design concept project for Nike SB. If you didn't know, I am a huge skateboarding fan. I used to skateboard when I was younger, I still do from time to time. For some reason I stopped but I keep up with the sport by following skaters as well as watching the Street League. If there's one thing that got me into design was skateboarding. The culture, the style and the focus on creativity are very important for a skateboarder in a very similar way it's for designers. Anyway, enough of me talking, check out this super stylish UI design for Nike SB. UI Design Concept  

Interaction Design & UI/UX: Unight Experience

Interaction Design & UI/UX: Unight Experience

Hope everyone have enjoyed a long Weekend with Labour Day. Time to be back and let's start if off with an interaction design and UI/UX of a web and mobile app called Unight. It's a mobile app to help you guide through your city regarding dining and especially nightclubs. For this concept to be fully functional, I would imagine that these locations must be active on the platform. Adding the QR code integration is neat but I wonder if it's still on nowadays. I might be wrong, anyways check it out! Collaboration work between Heartbeat Agency and MindStudios who is web and mobile design studio based in Dnipropetrovsk, Ukraine. You should definitely follow their Behance for upcoming projects related to interaction design. Cool mobile app with direct access to dining and clubbing locations in your city Project Gallery Credits Designed by Heartbeat Agency UX, Business Strategy and Development: MindStudios More Links Learn more MindStudios at themindstudios.com Follow MindStudios on Behance

Interaction Design & UI/UX: Sherpahire.com

Interaction Design & UI/UX: Sherpahire.com

An interesting project to share that involves interaction & UI/UX for Sherpahire.com. What is a sherpa? I honestly had to look it up and discover that web design was done specifically for a target audience and for this case as elite mountaineers and experts in their local area. It's an interesting approach since the focal point of the design is all about the search surrounded by a gallery of beautiful imagery. Since the images are part of what's called the center piece, everything else from the typography and micro-interactions are only played as an extra role. Published on Behance is the collaborative work from Alexander Laguta, Kate Laguta, Alexander Aubakirov, Alexei Rezvanov and Andrey Petrunin. All together sharing their expertise in Art Direction to Motion Design. Props to everyone involved. Sherpahire is the unique service allowing travelers to find sherpas and orginize their trekking vacation. We were asked to create a simple and eye-catchy interface allowing to find a sherpa, meet like-minded travelers and get inspired about Nepal as a trekking destination. We have used simple geometrical forms to create general style for Sherpahire brand and easy to follow interface allowing visitor to solve his goal and meet Nepal at a glance. Enjoy! Project Gallery   Credits Alexander Laguta Kate Laguta Alexander Aubakirov Alexei Rezvanov Andrey Petrunin More Links More about this project on Behance

Interaction Design & UI/UX: Kickstagram, an Instagram Marketing Tool

Interaction Design & UI/UX: Kickstagram, an Instagram Marketing Tool

Let's take a look at this interaction design & UI/UX project from the folks over Bachoo Design Studio. Their project is called: Kickstagram, an Instagram Marketing Tool. We've seen many Instagram tools out there but a lot of them lack features that will actually make us use it even more. If you remove the UI aspect from Kickstagram that is simple and clean. I liked the features that complement the application as well like Drafting & Posting and especially the Drag & Drop Scheduling is a neat idea. Bachoo Design Studio is a design team located in Kyiv, Ukraine. They would mainly work into web design, graphic design, UI/UX and more. You should definitely follow their work on Behance. Photo Gallery   More Links Check out Bachoo Design Studio's site bachoodesign.com Follow Bachoo Design Studio on Behance