How to “upgrade” a designer: tips and useful links

The authors of the article interviewed Russian designers and Internet experts, and asked for advice on how a novice designer can improve his professionalism.


In a blog on Habré we write about the development of web technologies and their practical application – previously we published stories of non-techies who studied layout and got a job in the IT field, and today we will continue the topic of training. Another area that is closely related to layout is web design. This time, we asked Russian Internet experts for advice on professional development for aspiring designers.

Designers must constantly learn and “pump” their skills. This is the essence of the profession. If you stopped learning or doing something new, then you are dead as a designer. Thus, all living designers know how and where to learn. I don’t think I can give them anything useful advice. But I’ll try:

  1. You need to constantly practice design. Solve new challenges, draw concepts, try fancy stuff, learn new tools. You can’t be a good designer just in theory.
  2. Sometimes it’s worth looking at what other designers are doing. Use their ideas, but in your own way. But this is not worth getting carried away with, there is no point in going through all the design blogs every day.
  3. Explore and try something else besides design. The best design always comes from technology or other domains. I recently spent a few days to assemble a huge Lego Technic tractor – I think it will be useful in work as well.
  4. Design parties and conferences are a very rewarding way to spend time. I strongly advise all designers to go to the OFFF in Barcelona.

Anton Shineft, designer, worked on projects for Cossa.ru, PostNauka

First of all, it is worth understanding that design is a very extensive field of activity, and if you nevertheless decided to take this desperate step, then be prepared to spend all your free time on this activity. However, I am sure that this rule applies to any other types of activity.

Usually novice designers are faced with the problem of “abstract” knowledge, which they find hardly applicable for themselves. An incredible number of lectures, design topics, motivating and inspirational materials and historical essays. With experience, these things will become more valuable, since the problems that authors touch on in these works actually lie outside of design – in the sense that a beginner understands it. Although I am sure that even beginner designers can form a holistic view of the subject even before the start of training.

The bottom line is that no matter what super-idea and imagination a person possesses, without knowledge of tools, technology and theoretical basis, these abilities may turn out to be useless. It is necessary to highlight several areas in which it is worth “pumping”, doing it in parallel, getting a multiplier effect. All these areas are intertwined, and, by generalizing knowledge, you can get an impressive result.

For general development, there is a whole series of books A Book Apart, covering different areas of design.

In terms of practical application, there is no better way than trying to imitate a style, finding tools to do something similar. Only by learning different techniques, you can invent your own. Today, designers have incredible scope for creativity, learning new programs, not limited to the standard Adobe suite.

In order to work “off the table”, there are also a huge amount of resources. Motivating yourself, including the set deadlines, you can try to participate in online contests. For example 99designs.

Of course, this requires endurance and perseverance. I know a person who started to practice design on this site and after three months found a regular client from the United States with a contract.

And of course, Dribbble. By the way, there are two invitations. I will give it to those whose work will be pleasant.

If we talk primarily about interface design, then a few years ago a significant part of designers were self-taught, often with a rather chaotic store of knowledge gained in practice. Now the situation has changed: there is no previous lack of information, but the market has pulled up and filled with professionals who are ready to share their experience.

Self-study is still an option for beginners who are just starting to get interested in interface design, we usually recommend the following materials:

  • Apple: iOS Human Interface Guidelines and Design: Apple Developers
  • Android: Google Design and Material Design Guidelines
  • Presentation of Information by Edward Tufty
  • Basic Principles of Interactive Design, Bruce Tognazzini
  • A Mental Hospital in the Hands of Patients by Alan Cooper
  • Design for the Real World, Victor Papanek
  • Design: Form and Chaos by Paul Rand
  • 10 Rules of Good Design by Dieter Rams
  • Tapworthy by Josh Clark
  • “Don’t Make Me Think” by Steve Krug

I want to note that for a successful start, guidance from professionals will be extremely useful – be it online courses or offline educational institutions with appropriate programs. There are quite a few options, but I would like to point out the following courses:

Nevertheless, if you ask me about the surest way to gain not only knowledge, but also skills with real experience, then, in my opinion, this is an internship in a company that has established itself in the market.

Anton Shein, Head of Yandex Search Results Design Service

At the beginning of December, Anton wrote an article on Habré, in which he spoke about how a designer should start studying web technologies. Here are excerpts of his answers.

Does a designer have to know how to work with web technologies?

The right question is: does the knowledge of web technologies help the designer to solve problems? Yes, it helps. Especially if you are working on a product where data plays an important role.

Where to start learning web technologies?

There are many interactive online courses. But, in my opinion, it is not necessary to start with them. When you start practicing martial arts, at first you will not be taught the techniques. First, you will need to learn how to run, do push-ups, squats – that is, in every possible way to prepare your body for classes.

So it is here. You need to start with two very important skills:

  • Ten-finger blind printing.
  • Basic reading ability in English.
  • Ten-finger blind printing.

A Few Tips

It is better to use The Typing Cat or Clavarog as a trainer. The rest of the simulators are a mockery of the psyche, and they do more harm than good.

Once you start practicing touch typing, resist the temptation to switch back to your usual method, even if you really want to. The learning rate from this will tend to zero: this is how the brain works.

The skill is useful for more than just code. By starting to type blindly, you will save a lot of time on correspondence.

Basic English Reading

As you study the code, you will have many questions. Thanks to Stack Overflow, there are answers to them. But they are in English. In addition, there are a lot of good tutorials and articles in English. If you can read them, it will be much easier for you to learn.

At the same time, you do not need to go to courses or open a thick textbook. Your brain is a neural network. And if you just force yourself to read the answers and articles in a foreign language, your brain will adapt itself. With each article you will find it easier to understand what you read. A good help in learning will be a browser plugin that translates words when selected.

Another way to learn to read in English is to force yourself to watch TV shows without dubbing. For this, there is, for example, the wonderful ORORO.TV service.

Better to start with simple TV shows, as “Sherlock” or “The Big Bang Theory” will be difficult to watch. I myself got very advanced in English while watching Lost during training. There is very simple English, and the plot is so uncomplicated that it is clear what is happening without translation.

Online Courses

If you have mastered blind typing and can read at least a little in English, then you can move on. For example, try online technology courses. There are a lot of them, there are paid and free ones. […]

But the courses have a problem: they chew everything very gradually and slowly. You manage to fall asleep without getting to the point.

Bonus: Anton’s several talks on design and prototyping:

Mikhail Shishkin, founder and creative director of SHISHKI branding agency

Today there is a growing demand for specialists who are not only “pumped” in their field, but also know how to look around (T-shaped person). The broader your horizons, the more likely it is that at some point a fresh idea from another area of ​​expertise will enrich your current project, help you take an outside perspective, or apply interesting new solutions from another area.

That is why I believe that modern designers should definitely learn the basics of layout. I would single out four main reasons why this is absolutely necessary:

  • Knowing the layout gives you an understanding of the limitations of what you are doing, so as not to draw something irrationally feasible. A good layout designer does everything, but will it be ideal in terms of labor costs?
  • Horizon. Knowledge of techniques is not only knowledge of the limitations, but also vice versa, the possibilities that technology gives. In order not to include self-censorship ahead of time and not to “simplify” everything, you need to understand what is actually possible. The courage of a decision is based on an understanding of the possibility of implementing it. You know it’s possible – suggest a cool move. I’m not sure – you’re being careful.
  • Don’t be intimidated by a lazy layout designer. You can answer all “not to make up like that” “even I know how” if, of course, it is possible to make up like that, and you know at least approximately how to do it.
  • Empathy. Have you heard about this? This is when you empathize with other people’s problems – very useful for healthy and productive relationships with people with whom you communicate directly at work. Understand the problems of your colleagues, and you will more easily win them over.

In 2015, I read the report “What the layout designers are laughing about” at the Design Prosmotr conference in Moscow (see video and slides). In addition to the tips to designers from layout designers that I collected on Twitter (name layers, be ready for data, and others), I showed the public the familiar interface for animation in Photoshop and reminded how dreary it is to make animation and in what oak GIF format it comes out of there.

And then I compared it to a simple piece of code that cyclically animates a background image, where it is described in simple English words:

@keyframes wave {
from { background-position: 0 0 }
to { background-position: 0 622px }
}

.wave {
background-image: url (wave.png);
background-position: 0 0;
background-repeat: repeat-y;

animation-name: wave;
animation-duration: 2s;
animation-timing-function: linear;
animation-iteration-count: infinite;
}

Such animation turns out to be light, smooth, customizable and understandable for the layout designer. You can see it directly on the slides, which are also laid out.

This seems to be the answer: do not rush to master the entire stack of web technologies from scratch to the very stars. Even the most experienced layout designers do not know everything. Start solving your problems more efficiently, one task at a time.

  • Make a rubber responsive grid on flexes or grids and see for yourself how it looks on different devices – instead of drawing bricks at three resolutions, because there are at least three hundred and three of them.
  • Animate the drop-down menu or unfolding the accordion exactly the way you want it, not the way your layout designer did. With translucency, correct smoothness and acceleration.
  • Be amazed at how different font smoothing is on different platforms: from macOS to Windows (or the simplest mobile phones), and stop demanding that it be exactly the same as you are used to in Photoshop.

Experiment, try, know the properties and dynamics of the surface on which your web design will be “printed”, learn to use its capabilities 100%.

For inspiring examples of interfaces in code, go to Codrops, try your hand at CodePen and read the entire A Book Apart series – I can recommend literally every book that is worth JavaScript for Web Designers.

Source: habrahabr.ru
Cover photo: ShutterStock

Author: Clark Douglas

Leave a Reply

Your email address will not be published. Required fields are marked *