# #

Tandem

UI design concept for the iPad mobile application
developed for designers who want to be creative on the go

What is Tandem App?

“What if…” is our brand new conceptual project for a professional design tool designated for iPad Pro. As you may know, iPad Pro is definitely a viable and prominent hardware, but it has a flaw - there’s just not enough professional software specifically intended for it. Fortunately, that’s where we step into the picture.

Meet Tandem

So, why Tandem?

It makes zero sense to have a professional working tool on iPad without proper integration for desktop tools. You see the point. Although it’s called iPod Pro, it’s designed to be a companion device. We named it Tandem because it offers in-depth integration with desktop tools for creating seamless and well-made interfaces. Users will be able to open projects with Adobe XD/Figma/Sketch on compact iPads and still do miracles

Layers

UX Decisions

Question

The challenge of how to arrange layers in UI-creating tools has been addressed by Adobe XD, Figma, and Sketch developers. Should you show items with layers or hide them? It’s a difficult question.

Solution

We believe that there must be an item with layers in the tool for creating interfaces, but it’s not as critical to put it on constant display. So, we’ve decided to use a working solution from ProCreate

Properties

When optimizing a tool to touch display, the most important thing to consider is that there is no space for property sidebar. Instead of that, we’ve decided to create an interface around the property popups. The main popups and the sub popups with the side properties are all there.

Assets

Optimization

In general, we tend to like Sketch a lot. However, we also understand that its organization properties can be better. Also, we needed to consider that this project had to be optimized for the screen of an iPad and it would be inconvenient to have a separate symbol page. That’s why we’ve taken another route for organizing the assets.

Take into account that this project had to be optimized for the iPad screen and it would be inconvenient to have a separate page with the symbols (as it’s implemented in Sketch), so I decided to organize the assets that way.

How can I design
without keys?

One of the big issues of full-scale working with touch screen is the lack of keys such as Command, Shift, Option, and so forth. Therefore, we’ve decided to use the gestures and the Apple Pencil.

Keep the gestures’ descriptions as they are - they work with 10px gap.
Same as pressing a button

Keep the gestures’ descriptions as they are - they work

Keep the gestures’ descriptions as they are - they work

Holding three fingers and pressing Pencil selects
the layer leaving the groups out

Two-fingers swipe left-to-right cancels the action

Two-fingers swipe right-to-left repeats cancelled action

Moving two fingers in a circle rotates selected element

Spread/pinch gest is the same as zoom-in/zoom-out the workspace

Moving two fingers navigates the workspace

What about the file system?

A file system is an important part of applications of the kind because it’s very critical to find the right files and do it fast. By default, the files are displayed in a tile view, but there’s also a chance to switch to a list view. In addition to basic file management features which include options to delete, select, and duplicate files, it’s also possible to import files in various formats such as .psd, .sketch. .xd, and so forth.

Prototype Mode

When you design screens, regardless of whether it’s about mobile or web interface, you need to be able to see your work in progress. Tandem’s Prototyping features make this very easy.

Case Studies
Let’s make something amazing together
0%