Tag Archives: designer

ux designers tubik

10 Ways How User Experience Designers Bring Value to the World

What makes us feel happy at work? Choosing the career path or switch, we ask and answer tons of questions and try to analyze the variety of factors. No wonder: that choice determines our lifestyle, relations, personal and professional growth for the big part of everyday life. Recently, we’ve run into this sort of question at Quora which sounded like «How do User Experience designers (Mobile and Web) provide value to humanity?» and became the ground for today’s article.

 

The question is definitely great and the answer, in particular, can be important for the young specialists who are considering this career. Not only in terms of the humanity, but also in terms of yourself adding something to the global progress. Whatever people tell about money as the key point, in creative spheres there is a variety of research showing that designers need the feeling of creative growth and participation in global progress not less than a good salary. One of the articles in Harvard Business Blog mentions three big reasons that are common in making people happy at work: a meaningful vision of the future, a sense of purpose and great relationships. Specifying the sense of purpose, they state: «People want to feel as if their work matters, and that their contributions help to achieve something really important. And except for those at the tippy top, shareholder value isn’t a meaningful goal that excites and engages them. They want to know that they — and their organizations — are doing something big that matters to other people.» Being aware of the destinations and seeing themselves the part of globally important processes, people tend to make the choice of a particular career as good for them.

 

ux designers brainstorm tubik

 

Without getting dip into the sphere, you can see UX designers like people working out endless flows of screens. At the first sight for many people who don’t deal with all the aspects, this job looks neither interesting nor creative. And the aspect of its value for humanity also seems to be not so obvious. Here in Tubik, we’ve been lucky to see the sphere of UX design high and deep, in all its diversity, creating digital products for the companies worldwide. And what we’ve seen and taken part in, makes us certain to answer: UX designers do provide a considerable value for humanity.

 

Before starting the list of aspects for this value, let’s check the terminology. In one of the issues of UI/UX Design Glossary, we described UX in the following way: it is the general attitude and emotional feedback that user has at different stages of using the product. In terms of digital products, such as websites or applications, UX is a comprehensive term involving all the possible stages of user engagement. UX is based on several key factors such as usability, utility, desirability, attractiveness, the speed of work etc. If all the logic and possible issues of product implementation into real life are analyzed and designed properly, it forms positive user experience which means that users are able to satisfy their needs in a fast, easy and pleasant way. Positive user experience remains one of the strongest factors of retaining users.

 

Tubik-Studio ux design

 

Working on the UX for a digital product such as a website or mobile app, UX designers have to concentrate on such aspects as:

usability (the product is convenient, clear, logical and easy to use)
utility (the product provides useful content and solves users’ problems)
accessibility (the product is convenient for different categories of users)
desirability (the product is attractive and problem-solving, it retains users and creates the positive experience which they are ready to repeat).

 

All of the mentioned positions present the value for people in terms of particular operations done day in and day out as well as global processes in different spheres like commerce and business, education, management, housekeeping, communications and so on, and so forth. On the ground of everything above mentioned, we could assume several points of the value which UX designers provide to humanity creating a wide variety of digital products.

 

What are the values brought by UX designers?

 

1. They support fast, easy and productive communication worldwide via products like various messengers, social networks etc. Communication is one of the key reasons why people turn to websites and apps, and its flow has a great impact on user’s life, from personal chats with family and friends to professional online conferences and business negotiations. Creating user experience for this purpose, designers have to study the needs of the audience and offer the appropriate solutions which will make the product helpful for getting in touch with other people.

 

bikers website blog

StarDust Bikers Website

 

2. They support international collaboration working over successful experience for apps enabling productive work within a team scattered around. Today the world has a number of applications and tools enabling professionals to work effectively from different places. That creates new business contacts and supports a great variety of international projects. And by the way, sets the ground for creating new workplaces, raising profits and developing welfare which, no doubt, sound like credible value. The platforms, apps, tools and software enabling specialists from different cities, countries, and continents to operate in a big number of professional activities, all have user experience designers behind them.

 

3. They support everyday life of millions of people with digital products that solve actual problems (like to-do lists or apps for taking notes), inform (like news websites or different blogs), and entertain (like apps for listening to music and watching films as well as tons of games). Every day, using quite basic and simple things like alarms, news platforms, video apps or music players, most users don’t even imagine that simplicity of those interfaces and navigation which makes all the flow intuitive are the result of thorough work which takes many hours. User experience designers are the one who have to build these products helpful and pleasant-to-use on the balance of applied content, target audience and business goals.

 

upper app UI design case study

Upper App

 

4. They support and improve core spheres of human life like health care, education, commerce, and self-expression. In this aspect, UX designers are the contributors into different fields of human growth and development. They create the flows of interactions and layouts for educational websites, applications used in medical treatment and health care, data analysis, technical support and other directions. Add to it the variety of specialized platforms where people share their creative outcome like artworks, music or pieces of writing — all of them need experience and interactions appropriate for these needs.

 

health care app interactions tubik studio

Health Care App

 

5. They make technology more accessible which means closer to people of different ages and nationalities, levels of education and tech literacy, physical and mental abilities or disabilities. User research is one of the core parts of UX design, and one of the objectives is finding the solutions for problems, which could make using the product hard and tricky for some categories of users. Diligent UX designers aim at creating products which will be inclusive and accessible for users of different abilities.

 

6. They support the concept of non-stop learning through life via educational and information resources. Motion is life, and motion through the ocean of information around is not an easy part of it. People are born with natural curiosity, the wish of getting knowledge and being informed. UX designers contribute in this eternal human movement creating flows at which users, readers, learners will not get lost under the tons of data. They apply the techniques and methods of information architecture to make the interfaces organized and problem-solving for their readers.

 

tubik studio web ui design

Birds of Paradise Encyclopedia

 

7. They respond to the human need of harmony and aesthetic satisfaction finding the ways to make digital products both useful and beautiful. There are many people who support the idea that digital products of today should be minimalist and purely functional. However, life is not just like that: practice shows that people want to both solve the problems and feel aesthetic satisfaction using apps and websites. The balance of these things is included in responsibilities of UX designers.

 

calendar-app animation tubik

Calendar App 

 

8. They support the process of creating the products which will simplify and automate the decent mechanic processes saving time for activities applying creative human energy. More and more products nowadays, including chatbots, are able to automate simple things, for example, scheduling, computing, checking grammar in writing, analyzing and organizing received data etc. Those things allow to people to accomplish some tasks faster and easier and free their time for more creative tasks which machines cannot do. This is one more side of positive user experience.

ngin_app_car_statistics_animation_tubik

NGIN App

 

9. They keep the balance between the rational and irrational parts of human life and activity. UX designers work on the crossroads of rational and emotional sides of human life: creating apps and websites, they have to consider both logical thinking and typical interaction models as well as emotional background which can greatly influence user behavior.

 

cinema app interaction UI

Cinema App

 

10. They make beauty working and logical as well as they make simple operations beautified and pleasant to the human eye. No special comments are needed. UX designers know how to get the efficient combination of beauty and functionality, doing it in the way which the particular product and audience require.

 

home budget web interface

Home Budget app

 

Surely, this list is not full as well as the issue is not so purely positive. There are many aspects of the job of UX designers, some of which are inspiring while the others are challenging or confusing. Still, we suppose the given positions are a good ground to believe that the job of UX designer is the one creating real value which has plenty of shades and tones. On the other hand, this variety of values added by the representatives of the given professional field brings out the number of responsibilities for the job, which should be also considered and kept in mind.

 

ux designers tubik

 

Life of UX designers is not the life of a magician flying in silver clouds and saving the world with every move of a hand. No, it’s a flow of rigorous research and analysis, creative effort and review of the slightest details — and many other things to mention, as well as in any other job. However, that is definitely the job that brings something precious for the humanity of today and tomorrow.


Welcome to see the designs by Tubik Studio on Dribbble and Behance

Welcome to read us on Quora

design events benefits

5 Big Benefits of Attending Local Design Events

Being a designer is not only about pure creative process. Design is also about communication with colleagues, managers, clients and experts. This connection can be done not only in the flow of current projects but also at a variety of design events held all over the world. And, as the famous author and speechwriter James Humes stated, «The art of communication is the language of leadership» which works prominently in creative spheres of human activity. So, today let’s briefly review what are the key benefits which designers can get from attending specialized events like conferences, meetups, workshops and so on.

 

1. You absorb knowledge and inspiration from experienced designers

 

If you have had the chance to read about art education a couple of centuries ago, perhaps, you learned the stories how great masters started their path from apprenticeship for masters of that time. It was the way which in the case of appropriate diligence and patience could open the door to the world of genuine great art. Centuries have passed, generations have changed, but this way still hasn’t got lost in time: we learn the secrets of the job from those who have already got them through practice. That is one of the reasons to attend the design event, especially for those who only start their career in the field. Some of the speakers will give you useful tips on design tools while others will share their experience in methods of time management and collaboration. Some of them will tell you about new trends in design while others will show the flows of real projects. There is even a chance that there will be speakers who will show you the methods and ideas you’d never like to try — and even this result is positive at it saves your time and effort for testing all them by yourself. Don’t waste the opportunity to take what they are ready to share. Surely, to get the chances of positive experience higher, it’s advisable to check the program of conference or meetup beforehand.

 

You may like recognized designers more or less but remember: they ARE already well-known and successful. That means there always exists something you can learn from them. Analyze, get inspired, try to see the best features so that you could get the technique. It was effective hundred years ago in old-school art education and it still works now. 

 

2. You get live communication with experts

 

Reading the thoughts provided in the previous point, it’s easy to argue: why would you need to attend the real event if tons of them can be found via the Internet in videos, photo workshops, podcasts, articles, and books? The reason is simple: all those ways of getting professional knowledge and training are great and helpful, but none of them can fully replace the experience of live communication. The precious moments when you can ask the question right in the process of live talk flow are irreplaceable. Moreover, make no mistake: conferences and meetups are the places where everyone, including speakers and organizers, is ready and open to communicate with you while in ordinary days full of creative search, management and loads of current tasks they do not plan their time to answer the questions from other designers. Cool if they can do it but it happens not so often whereas for the professional events it is a natural state of things: everyone goes there to communicate.

 

One of the upcoming local events of that kind called Shuba Design Conference will be held in Dnipro, Ukraine in the late May. Its philosophy is all built around the idea of providing the space for effective and fruitful communication of creative people both in form of the speeches from the experts and live brainstorming with colleagues. This year the motto of the event is «Design beyond the borders» setting the new perspectives and new flows of creative energy in the sphere. Furthermore, the organizers bring out the opportunities for designers to participate in the contest of posters «BORDER STUDIES» and express their ideas in the artworks which will be accepted until 14 May. If you are interested to know more, check the details here. Let us know — we’ll be happy to get in touch!

 

design conference shuba ukraine

 

3. You can get the qualified feedback on your work

 

While most design meetups set the platform where experts share their knowledge and experience, some events also create the foundation for getting live feedback on design portfolios. One of the founders of this movement worldwide is Behance, the well-known design platform for portfolios in a variety of creative directions. Behance Portfolio Reviews held in different corners of the world let every designer get a professional and objective review from the local design community. This is one more upcoming design event we are looking forward to this May — Behance Portfolio Reviews Dnipro inviting young designers to present and discuss their portfolios.

 

behance portfolio reviews dnipro 

 

4. You set new business contacts in design sphere

 

One more big reason to attend design events is directly connected to business issues: this is usually the fruitful ground for making new contacts useful for your career. It works the same as at any other specialized event: you can get in touch with other designers for collaboration on complex projects as well as you can meet new potential clients or investors. Again, live communication and real impressions make a considerable impact on decisions which can change the prospects of individual designers or even design teams for better. 

 

5. You get refreshed from your routine and check the trends discussed at the moment

 

Last but not least is the reason of refreshment, actual for professionals from any creative sphere. Getting dip into specific tasks and working on several design projects simultaneously, artists really need that breath of fresh air which will reboot their creative energy and give new directions of vision. So, if you see the event with interesting speakers or themes actual for you, don’t hesitate to give yourself a moment of new experience: it will take you away from you current work for some time, but it will let you get back with new ideas and impressions absorbed from the design community.


Welcome to get more details on Shuba Design Conference (Dnipro, Ukraine, 27 May 2017)

Welcome to get more details on Behance Portfolio Reviews (Dnipro, Ukraine, 13 May 2017)

toonie alarm UI design

Case Study: Toonie. UI Animation Development.

In most cases, when users deal with animation in the interface, it takes short seconds and feels as natural as a breath. Being far from design and development routine, it’s almost impossible to imagine that these brief and simple interactions take long hours of thorough work presenting mix of science and art. 

 

In our previous articles we had numerous chances to show you diverse UI animations solving users’ problems and enhancing usability, still they were mostly presented in design perspective. Today’s  case study will set the link between design and development for iOS mobile applications: it will show you collaboration of UI designers, motion designers and iOS developers working over animation for Toonie Alarm. Previous case studies already let you see the creative process for user interface and mascot design, but this time you will come along step-by-step guide on how animation was created for the app. 

 

Time Picker animation

 

Time picker in the alarm application is actually the core part of interaction with the app and the primary element at which motion design and development play the vital role for establishing both usability and visual harmony. Let’s see how science, calculations and code are able to transform into beauty and style.

 

toonie alarm UI animation

 

All the content of animation is placed on custom subclass UIView, for this case we call it AnimatedDayView.

 

layers_scheme toonie-ui-animation

 

The bottom layer is Infinite UIScrollView (1 on the scheme above). It is the endless scroll view that includes the copies of the image below.

 

toonie scroll animation

 

There are numerous ways of realization for endless scroll. The main idea of replacement in scroll view is to recalculate the size of the scroll view and replace the invisible previous image showing the new one and adding the one for the future.

 

In the case of animated time picker for Toonie, we took the starting point as 6 AM, therefore the middle point is 6 PM and the ending point is 6 AM of the next day.

 

The next layer is Stars UIImageView (2). This UIImageView is added over the scroll view and goes round its centre; during this process the Alpha of the layer is changed. It means that in the daytime it is transparent while in the evening time it gradually appears.

 

stars_ui-view_scroll_animation

 

The next layer is CALayer for the sun and the moon— SunMoonBackgroundLayer. It isn’t seen on the scheme as it has the same size as AnimatedDayView. It also rotates around its centre which is below the visible frame of the screen (5).

 

On the SunMoonBackgroundLayer, there are two more layers — for the moon (3) and the sun (4). The layer of the moon rotates to the same angle as SunMoonBackgroundLayer but in the opposite direction. The sun rotates to the higher number of radians.

 

The issue of great importance here was to thoroughly calculate at which number of degrees should each layer be rotated and how far should the scroll go on. The scroll presents the easiest part. The input variable is always time, that is the hour and minutes which user chose on UIDatePicker. With this data, it’s quite simple to calculate the scroll view shifting. Initially it will be zero, which in our case is equal to the time of 6 AM as we set above. Imagine that user has picked the time 9.10 AM. We can understand which number of pixel the view has to shift down or up when we calculate the difference of the time in minutes (190 minutes) and transforming them into pixels. All the scroll ground presents 24 hours, so its height presents 24 hours, therefore 1 minute=image_height/minutes_per_day (60*24). Knowing the value of 1 minute, it’s not difficult to calculate how many pixels are set into 190 minutes. The only thing left to do is to move the scroll on the required number of pixels, which can be also negative in cases when the new time is less than the previous setting.

 

The next important parameter is Alpha of the stars. It can be calculated with understanding at which particular place on the background image we are at the current position. It means that at 6 AM in the top part of the image the stars should have Alpha 0 value because the morning starts. And the stars are ignored, aka kept in Alpha 0, up to 6 PM, and then Alpha value should be gradually increasing so that at midnight Alpha reached 1. The calculation of dynamics and intensity here can be different depending on desired visual effect. The core thing is that we have the basic parameter which we can rely on: the current position on the background image. And it can be easily calculated knowing the time set by the user. With alteration of Alpha motion, attractive visual performance can be effectively reached.

 

To calculate the angle of rotation, we take 360 degrees for 24 hours. So, 0 degree = 6 AM. We calculate the difference in minutes, find the number of degrees per minute and set the degrees required for shifting.

 

Another element of animation is clouds. They appear due to NSTimer. It adds one of the graphic variants for clouds (the app uses three graphic versions) with random coordinate of Alpha (transparency) beyond the limits of the screen on the right side. After that animation of movement (changing the centre) starts from right to left. The timer is launched with the random interval.  After the animation is finished, the cloud is gone.

 

toonie alarm time picker

 

Sun switch

 

Another piece of animation that required attention and creativity was the switch on the Alarm Screen, the actual element of interaction showing that the alarm is set and active or not. Design solution supporting general visual performance of the app was to make the toggle look like the animated sun when alarm was in the active position.

 

toonie switch UI animation

 

Looking over the accomplishment of the presented motion via code, we see that this is the UIView which contains several layers.

 

toonie-ui-switch_animation

 

The first layer is the background of the hole in the switch (1) which has a rectangular shape. Above it, there is the circle — the toggle of the switch (2) which is the centre of the sun. It can move leftwards or rightwards. Another layer is the sun rays (3). They are set as the separate layer because they have the endless animation of rotation.

 

When the switch is off, the rays change their Alpha to 0 and animation stops. Over all the mentioned layers, the largest layer is placed which is the background of the switch (4). This is also the rectangular layer which has a mask CAShapeLayer drawn with two UIBezierPaths.

 

 

The mask cuts off the layer of the required shape and switch gets a look of the final view. For interactive controlling, two Gesture Recognizers are added: UITapGestureRecognizer for pushing and UIPanGestureRecognized for pulling the toggle.

 

This practical case shows that making animation which will realize its problem-solving potential looking attractive and natural is a demanding task requiring thoughtful approach and collaboration of designers and developers for users’ sake. If you want to test everything described above in real interaction, just set Toonie and see how it works. And don’t miss new cases telling more stories of creative process.


Welcome to set up Toonie Alarm via App Store

Welcome to read case studies about user interface design and mascot design for Toonie Alarm

Welcome to see the designs by Tubik Studio on Dribbble and Behance