… and why you should

What are the differences between and ?

UI is about emotion and aesthetics in a supportive way to Usability. UX is the whole — it contains the emotional aesthetics created by UI as well as the analytical, logical, human-centered Usability created through User Research, Requirements Engineering and Wireframing.

Why to practice your UI skills as a UX ?

Until these days my only role is “UX Designer”. It is not long ago I had this taken quite seriously and I had supposed this will stay at it is in the future. Always when developers ask me, can you get me this icon into the repository or what shall be the padding, I answered: “That is the task of the designer, I will ask him.” I even hadn’t the access to the repository. But that approach stops other disciplines to go on with their work.

Now my mind has changed from giving the whole responsibility of UI Design always to the UI Designer to mind also UI Design during ideation and wireframing. Vice versa the UI Designer should be integrated in the project at project start.

Maybe my mind had already changed unconsciously long time ago. UI Design supports the Usability, even builds an inseparable unity with it and therefor UI Design is part of UX Design. Because you cannot ignore UI as a UX Designer, it simply has to be part of my skill-set now. How can Usability become intuitive, if you don’t have the design into mind? That and because many company clients cannot differentiate between UX Designer and UI Designer and require the same skillset from a UX Designer as from a UI Designer and vice versa. I recommend also for the UI Designer to get into UX Design — even if their focus will be always aesthetics, as mine will be always Usability. But both have to mind the user’s behavior as well as their unconscious thoughts and bringing the insights into an intuitive Interface.

Don’t get me wrong: Since I have been a young child aesthetics, composition, colors and perspectives have interested me and were part of my life. For example, as a three year old child, my parents had laid out a white sheet of paper on the floor, which had almost a bigger size than me. With water colors I was painting the ground on the one side. Because I couldn’t reach the opposite side of the paper for painting the sky, I switched sides to complete the composition. But now the opposite side was also the ground for my perspective, so I had painted another ground on the opposite side.

Design is also a matter of individual perspectives

Creating creative and aesthetic things with depth and also humor were always my passion. I love art museums, my favorite art movement is Surrealism symbolizing the subconsciousness and my favorite artist is René Magritte. But I had seen so much better work in my surroundings that I had believed, I could not design the aesthetics, that will please. And guys, not even to try is not the right way. So, I decided, from now on I will at least train my UI Design skills. Try this for yourself and you can only succeed, because you will .

My approach to get into UI Design

My biggest question is: “How can a UX Designer start with getting into UI-Design?” Don’t wonder, I am still on search for the complete answer, but for a start, these are my insights for an answer:

1. Start with the Design Principles and Design Elements

Before I practiced UI-Design the first time, I learn the Design Principles. How do I learn them? I was watching YouTube Videos, that were related to the topic and read Blog articles. Soon I understood, the opinion about the number of the principles differentiates, because the granulation was not the same. One has to find for himself the right granulation of design principles to consider. At the moment for me works best the granulation of these 7 principles:

  1. Balance
Asymmetric balance creates an interested not boring impression of the design without appearing chaotic.

2. Contrast

For emphasizing a design element or a message, create contrast.

3. Hierarchy

If you start designing, think about the elements, which are more important, and which are less important.

4. Alignment

Alignments relax the eye unconsciously. But make the alignment-lines not visible, do it subtle.

5. Proximity

Group elements and separate different groups from each other. The scanning by the user will be simplified.

6. Repetition

Repetition is about learning and recognizing elements to create consistency.

7. Simplicity

Simplicity is about reducing unnecessary elements to transfer the important message out of a blur.

The next thing, I will learn are Design Elements. As soon as I am finished with them, I can share my learnings with you here on Medium.

2. Practice with already existing Designs

For the first practice I took an easy iOS-App, I had once wireframed and the UI Designer had once done the Designs. I transformed the iOS-App-Designs into Android-UI-Designs. Because I had already a template due to the iOS-Designs, I had only needed to keep the Android-Guidelines into mind, while trying to catch the UI Designer feeling 😉

I for myself exercised with the Golden Cut. I laid a copy over my Designs and checked, if they have the proportions of the Golden Cut. Make your UI Design as golden as it could be.

Even if you get no current chance to work on UI Design in a company’s project, you can practice on your own. Take the very first wireframes that you have made and transform them into Designs with your advanced knowledge. This was this weekend my next small private project. Here are the first results. You can see, I am no pro and still practicing UI Design, but it might be a beginning.

3. Get to know how the UI Design process starts

In the following thoughts, I consider that you had already done the user research as well as requirements and had prepared the Wireframes before. When your inner UX Designer is confident enough with the prototype, then the Wireframes go into UI Design. And that is where the extract will begin:

– Make a Moodboard

– Determine Picture Language

– Determine Colors

– Determine Typography

– Determine Grids

– Determine the interactive Elements Look

– Determine the Form Look

– Begin with UI-Templates

– Summarize all in a Dynamic Styleguide

4. Inspiration by other Designers

No matter, if you speak face2face with some colleague-designers, if you go to meetups or if you read books and look for other Website / App-Designs. From all of it you can learn a lot and grow your experiences. For example, this weekend I watched a Designer on Youtube, who had different folders with inspirational pictures, screenshots and so on for moodboards and for idea generation. Maybe this would be a start?

5. Practice with your own ideas

Intrinsic Motivation is here the magical key. What is more empowering, than creating you own ideas with passion? If you also have a developer by hand — then Congrats! You have made the Jackpot. Ding, Ding, Ding. Shoot for the moon and realize a project. Invite him into your ideas, make new ideas together, make them real and design, design and design.

How do you think about this topic? What were / are your approaches to get into UI Design? Feel free to give your insights for inspiration.

Source link https://blog..io/my-way-to-learn-ui-design-as-a-ux-designer-e547d60760be?source=rss—-eb297ea1161a—4


Please enter your comment!
Please enter your name here