Think like an APP Designer (2)

(Next)

With a variety of operating systems

When designing mobile apps, you can’t just look at your phone. If you are targeting the global mobile market, you must use at least Android, iOS and Windows Phone devices, and get used to them constantly, fully understanding the different usage scenarios of each platform.

In fact, the world of design doesn’t start and end with the iPhone. Many designers limit themselves to iOS, and when designing Android, they just translate — often almost word for word — the original App.

Interaction patterns, such as the way problems are solved established in the design, are different in each operating system. Also, designers must change systems frequently to understand and use them correctly.

For example, the placement of tabs on each operating system, how menus are displayed, and when and how primary and secondary actions are displayed vary.

You can learn the patterns of each system by following a few practical exercises here: Download and install the same App on different phones and analyze their similarities and differences; Their models will be different. So, if you find an App that looks and works almost the same on iOS and Android, either one is probably doing something wrong.

In addition, constantly watching and playing other people’s apps is a great way to solve your own interface problems. For example, a lot of times when we feel blocked or don’t know how to solve a problem, I play with my phone to see how they solve the problem I’m facing.

If you don’t have a Phone nearby, it might be helpful to check out sites with rich examples like PttrnsAndroid App Patterns and Windows Phone UI Design Patterns.

Regulate everything

The agile approach requires an understanding of how something will look and how it will look before the functionality is implemented. Similarly, prototypes help us evaluate the usability of the product (through user testing). Ideally, it shouldn’t take us too long to build the first prototype.

Few people probably remember palmtops: one of the first prototypes was a wooden board with a piece of paper that drew an interface design. Employees can carry it in their luggage as if it were a real device.

Its purpose is to test the size and comfort of use, and this prototype is enough. The question is to test how far you can go before you start designing, and then get to work.

There are many prototyping tools out there that can even look like finished products on a smartphone. That is, prototypes don’t just show static designs; It also includes pictures, transitions, and gestures.

Choose the most appropriate tool based on your workflow, what you want to achieve, and the results you expect. For example, I often use POP when I have simple wireframes on paper. With this App I can take photos of designs, add gestures and transitions quickly and easily!

But when a concept is more advanced, I find it easier to use design-specific software like Sketch, Marvel or Flinto or InVision, to make beautiful prototypes. (Note that some are not necessarily better than others. Which one you choose will depend in part on which one you feel is more comfortable using.)

As mentioned, there are a lot of prototype apps out there, and a few months ago I decided to create a small website listing all the ones I know. The site provides an overview of each tool’s features to help you choose.

On the other hand, “Material Design” like Android will focus more on subtle interactions. Prototyping subtle interactions is the responsibility of many designers today. (Tools like Keynote make it easy to do this kind of detail. Keynote magic action options come in handy.)

Don’t believe what you see

When designing a Web-side product, you can see it in action at work. But apps you have to test on a mobile device to see what the interface looks like. First, this test is necessary to determine contrast and size.

A tool for Android and iOS that helps designers view their work on mobile screens with different resolutions, the best known for iOS is LiveView. The other thing I use most is Skala with a desktop version for Mac (Android and iOS). If you’re using Sketch you can try Sketch Mirror.

Unfortunately, this tool doesn’t work for Windows and Windows Phone (at least I don’t know).

In my workflow, I often preview the design on my phone before each step to make sure it’s what I want it to look like. Again, I usually start with one system at a time and keep my phone by my side most of the time. This allows me to constantly check how my artwork will appear on the screen, while completing the first wireframes, I make sure the dimensions (graphics, text, and controls), contrast, and color are what I expect. If you don’t, it may take more time to fix when you discover the problem later.

It’s also important to start working with a design document the same size (length and width) as the phone you previewed your work on. (Note: If you’re designing for different screen sizes, keep in mind that pixels are no longer a good way to measure dimensions because they vary between systems — for example, note the dots on iOS and the Density independent Pixels on Android. At some point you have to fully understand the difference between designing and creating images in the mobile world.

Once your design has been implemented by the developer, check how the App looks and works on different phones and versions, not just the best phone you have at hand.

Humble Design

App designers must abandon the idea of creating the final product. Apps will never be finished because they are digital products that evolve over time. It is for this reason that interface design cannot be done from an absolute standpoint. It should be targeted by usability testing and deciphering problems experienced by users.

We designers sometimes tend to escape responsibility when users make mistakes and get confused while using apps. But in fact, we may well be wrong.

Detecting problems (and finding our mistakes) is not a bad thing. Of course, this is an opportunity to learn and correct the work so as to improve it and make it more usable. You have to be humble in your design.

Every time I told my boss I’d finished a design, he’d ask me, “Have you tested it with users yet?” I usually didn’t test it, but eventually I made it a habit, and every time I tested it, I was prepared to be open and willing to see the problems I found.

You can only do this if you are mature enough to accept your mistakes and learn from them. It’s hard, but it’s worth it to succeed.

Stay on the cutting edge

When designing for tomorrow, the amount of information makes it almost impossible for things to stay the same. However, as App designers, we have to be curious about what’s new and what’s going on.

This includes trends in App design and new versions of the system. Like it or not, we have to install new systems to stay on the cutting edge and see the latest App designs.

Reading the official design guide for the new version of the system is a good way to get a wide variety of design information. You can also learn from industry pioneers like Josh Clark and Luke Wroblewski.

Staying on the cutting edge also means trying to use tools that are available on the market to simplify design and make our work more efficient. We can’t be afraid to leave our comfort zone or leave the old ways of work and design behind.

Following these principles, NOT long ago I finally dared to use Sketch. It was a little difficult at first, because learning something new from scratch, when I had to use it I was already comfortable with the known tool.

Now, a few months later, I find that the software has an easy learning curve. It saves me time and keeps my mind sharp at work, which is a reward for my willingness to learn new things.

summary

Finally, adapt App design from the bottom of your heart. No one is forcing you to do this, and if you don’t fit in, you’ll probably be good at nothing but icon, which is just a small part of a larger design process.

First, App design requires a new way of thinking. It’s time to get out of the web design cage and understand that a smartphone is completely separate and different from a toilet raft or even a watch. This is really the only way to design complete, complex mobile products.