Interaction #26. Bottom Tabs / Search

Hi everyone,

I know it's been a while since I've updated my interaction library. Yes, I've been busy but also there's always a worm of doubt whether something is good enough.

Today tho, I honestly could not be more pumped to...🥁... start the new series of publications. New and better!

I've been paying attention, taking notes, and outlined at least 30 new interaction patterns to be published. Some of them would be enhanced versions of the behaviors I reviewed in the past and others would definitely be something you have not seen before (please let me know if you have). Besides, I'm just really delighted with the ability to post videos now. I know, old news, but hey, we all get busy.

From now on I'll be posting to it 1-2 times a week on a regular basis. I'll also be adding a bunch of extra materials like interaction diagrams, illustrations, additional states for elements etc.

This particular interaction is a combo of the search behavior and the bottom tabs that I used pretty heavily at my job at Shyft. Bottom tabs sometimes is the most accessible and clear way to visually explain the navigation hierarchy to your product users. You can combine it with the top nav and task your UI to convey the right priority to help people navigate.

Interaction library hits a few main targets:

- Quick access to the example of a generic interaction you can quickly share with your client to get a reference point on the table

- It’s easy to select and implement a behavior type that is suitable for a particular project you are working on, I’ll make it so that each serves a typical UX need

- I’ll cover the most interesting and non-standard approaches to explore relatively innovative behaviors so we all stay mainstream and up to date

- I love creating nice and smooth interactions, and so now I have a chance to do that independently of the project I am working on most of the time :)

What’s with the 3D now?

Mobile devices are inherently portable, that’s why we love them.

I think we, as mobile product designers, should be aware that the interactions we make are experienced on physically dynamic devices. Unlike cases of web, auto, or TV based platforms, mobile interfaces are more influenced by that physicality. Just like those UI shadows impact the UX from the visual design standpoint, the device movements affect how the product is experienced from the interaction design perspective.

Of course, the device movements are hard to predict and design around, but I think it doesn’t hurt sometimes to remind ourselves that we design for devices that tilt, glare, angle, turn, twist, rotate, and slide from a pillow etc.

Since the Interaction Library is focused on interaction patterns for mobile devices, I decided to factor it in to a certain extent.

It’s not a huge factor, but we all know that the products we deliver are made with those little details. The more attention we pay to all those little factors, the better our work is.

Curious to hear your thoughts on this.

This is just the beginning. Make sure to 💖 and follow for regular updates!