{"id":2014,"date":"2016-10-07T16:34:01","date_gmt":"2016-10-07T13:34:01","guid":{"rendered":"https:\/\/tubikstudio.com\/?p=2014"},"modified":"2023-08-16T09:19:44","modified_gmt":"2023-08-16T09:19:44","slug":"ui-animation-eye-pleasing-problem-solving","status":"publish","type":"post","link":"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/","title":{"rendered":"UI Animation: Eye-Pleasing, Problem-Solving"},"content":{"rendered":"

Animation applied in user interfaces is the topic drawing high attention and provoking hot debates nowadays. Although there is a big army of those who find animation an unnecessary feature overloading the user interface and making it more complicated, most users expect motion as an integral part of the interaction experience. So, designers and developers work over more and more sophisticated methods to make animation a pleasant-looking and problem-solving characteristic of modern apps and websites.<\/span><\/p>\n

Why do users love motion so much? Mostly, because animation supports the essence of actual and real interaction, it creates the level of feelings and perception close to what people have when they are interacting with a physical object in real life. This sort of feeling can boost the user experience rate of positiveness really high as the more natural user feels, the less effort is needed to deal with the app or a website, and the more clear it is how it works. Certainly, it makes users satisfied. No secret, satisfaction and pleasure are among the top things encouraging people to use the product again.<\/span><\/p>\n

Like everything that is put into the interface and process of interaction with it, the animation must be a functional element, not just a decor. Considering motion elements while planning the user journey around the digital product, the designer should deeply analyze its potential for increasing usability, utility, and desirability of the product before making a decision to apply it in the layout or transitions. Animation in UI requires a thoughtful approach and always needs to have a clear purpose set behind. The advantages and utility of using it in the interaction process have to be obvious and outweighing the possible disadvantages. The animation should become the icing on the cake, not a fly in the ointment.<\/span><\/p>\n

\"tubikstudio<\/p>\n

Define the problem<\/span><\/h2>\n

One of the best approaches to make animation functional not only attractive is to reveal the problems that it potentially can solve. It can be done at all the stages of the design process:<\/span><\/p>\n

– user research<\/strong><\/a> will let you know who the\u00a0target users are, what’s their age, preferences, level of tech literacy, environments and conditions at which the product will be used, and plenty of other factors from the users’ side that can influence user experience;<\/span><\/p>\n

– market research<\/strong> will give the insights of existing products, their strong and weak sides as well as methods of forming user loyalty, which is the good basis for defining USP solving particular users’ problems as well as original ways of the product presentation and performance;<\/span><\/p>\n

– UX wireframing<\/a><\/strong> stage will enable to think over the logic of interaction, layout, and transitions and get the first assumptions of the points which can be strengthened with animation;<\/span><\/p>\n

– prototyping<\/strong> stage will reveal new aspects of live interaction with the screens;<\/span><\/p>\n

– UI design<\/strong> stage will provide the complex visual presentation for the product scheme and system setting a new perspective of applying animation into the app or website;<\/span><\/p>\n

–\u00a0user testing<\/a><\/strong> will show if the decisions made about animated elements were correct and their benefits really outweigh possible pitfalls.<\/span><\/p>\n

\"animation<\/p>\n

At every stage, if the designer sets the goal to reveal possible big or small problems users can have, animation, as well as any other design element, can take the role of problem-solver for the case.<\/span><\/p>\n

Let’s review some typical problems that can be solved by means of interface animation.<\/span><\/p>\n

Problem: I want to know the action is done.<\/span><\/h2>\n

This is one of the problems that can be easily and quickly solved by animated details applied in UI. Microinteractions<\/a> supported by clear finalization via motion create fast feedback for the user and make the experience positive and efficient while navigation simple and intuitive. Animated buttons, switches, toggles, and other interactive elements<\/a> inform the user in split seconds activating all the potential of fast visual perception.<\/span><\/p>\n

\"switch<\/p>\n

Switch Control Animation<\/em><\/span><\/p>\n

\"hamburger<\/p>\n

 <\/p>\n

Hamburger Menu Animation<\/em><\/span><\/p>\n

\"hamburger<\/p>\n

Hamburger button\u00a0interaction<\/em><\/span><\/p>\n

\"tubik<\/p>\n

Tab Bar\u00a0interaction<\/em><\/span><\/p>\n

\"add<\/p>\n

Add Button\u00a0interaction<\/em><\/span><\/p>\n

\"page<\/p>\n

Rubber Indicator<\/em><\/span><\/p>\n

 <\/p>\n

Problem: I want to know that action is in progress.<\/span><\/h2>\n

This is also a huge area of application for diverse\u00a0motion design potential. When users interact with a digital product, they want to know what is going on at every single step. Making users wait in uncertainty is the risk of losing those users. Still, when users are informed, waiting can be not so annoying and stressful. So, this aspect should always be taken into account and there are many ways to support it via interface animation. This is the high time for pull-to-refresh indicators to come into play and show their best.<\/span><\/p>\n

\"tubikstudio<\/p>\n

Pull To Refresh<\/em><\/span><\/p>\n

\"preloader<\/p>\n

Preloader animation<\/em><\/span><\/p>\n

\"pull<\/p>\n

Pull to refresh<\/em><\/span><\/p>\n

\"pull-down-animation<\/p>\n

Pull Down \u2014 Hourglass<\/em><\/span><\/p>\n

\"tubikstudio<\/p>\n

Pull Down \u2014 Space Ship<\/em><\/span><\/p>\n

 <\/p>\n

Problem: I can’t see the progress and don’t understand how long it will take.<\/span><\/h2>\n

 <\/p>\n

Quite often it’s not enough just to let users know that the process is going on. They often want more: to see how fast it is progressing and how long it will take. Again, interface animation can be a great helper here. Load bars and progress bars, animated timelines, and other dynamic elements can kill several birds with one stone:<\/span><\/p>\n

– they inform the user about the level of progress<\/span><\/p>\n

– they can become the entertaining element blunting negative experience of waiting in the process of interaction<\/span><\/p>\n

– designed and animated in an original way, they can become a viral feature that users will want to share with others and engage more users into action.<\/span><\/p>\n

\"tubik<\/p>\n

Timeline App<\/em><\/span><\/p>\n

\"tubikstudio<\/p>\n

Dynamic Scroll<\/em><\/span><\/p>\n

 <\/p>\n

Problem: I don’t want to make my screen a mess.<\/span><\/h2>\n

 <\/p>\n

That is really a vital thing to think about in the interface design. If the screen or page looks like mess overloaded with tons of data which is not clearly organized, it will require additional effort from the user to understand how it works and where the needed information can be found. The more effort, the higher chances are getting that users will go away in search of a simpler solution. In the vast majority of cases users wish to have apps and websites that will simplify and improve their life, perhaps even will do some job for them rather than will take additional effort and time on interaction. Animation can be a good way to enhance interaction with various data blocks and sections and make everything feel organized even in highly data-saturated and complex interfaces.<\/span><\/p>\n

\"sports<\/p>\n

Sport App<\/em><\/span><\/p>\n

\"tubik<\/p>\n

Cards\u00a0Animation<\/em><\/span><\/p>\n

\"station<\/p>\n

Boat Station App<\/em><\/span><\/p>\n

\"tubikstudio<\/p>\n

Blog App<\/em><\/span><\/p>\n

 <\/p>\n

Problem: I want to see the key things first.<\/span><\/h2>\n

 <\/p>\n

Visual hierarchy and clear navigation are always a great concern for designers creating an interactive digital product. Users’ attention should be immediately drawn to the key element of interaction according to its\u00a0goal and conditions. Animated interface elements present great supportive force for this aspect, enabling faster and more distinct visual marking of important elements in the layout.<\/span><\/p>\n

\"tubikstudio<\/p>\n

Tab bar interactions<\/em><\/span><\/p>\n

\"tubikstudio<\/p>\n

Weather App<\/em><\/span><\/a><\/p>\n

\"resto<\/p>\n

Resto App\u00a0<\/em><\/span><\/p>\n

 <\/p>\n

Problem: I want\u00a0to feel the interaction natural.<\/span><\/h2>\n

 <\/p>\n

This is the problem that most users will not be able to formulate, still, it has a great influence on user experience. If users say something like “I’m not sure what’s wrong but there’s definitely a\u00a0thing”, try thinking over more natural interaction. Animation in the interface can create a pleasant illusion close to natural interaction with physical objects which often doesn’t need too much cognitive process. For example, if you pull the object, press it, move out the tab, the movements\u00a0should feel\u00a0natural. \u00a0Again, users won’t be able to see this sophisticated work accomplished by designers: they will take it for granted and the fact it makes them comfortable will be the biggest praise for design solutions.<\/span><\/p>\n

\"tubik<\/p>\n

Social Network App\u00a0<\/em><\/span><\/p>\n

\"tubikstudio<\/p>\n

Book Swap App<\/em><\/span><\/p>\n

\"restaurant<\/p>\n

Restaurant Menu<\/em><\/span><\/p>\n

 <\/p>\n

This sort of problem is also popular in interaction with web interfaces. Thought-out movement of layout elements while the webpage is scrolled can enhance user experience significantly and create the feeling of one integral smooth interaction rather than several separate parts or blocks of the page. All in all, it’s pleasant and engaging, and these emotions are a good factor for retaining users.<\/span><\/p>\n

\"tubik<\/p>\n

Landing page animation<\/em><\/span><\/p>\n

\"magicco<\/p>\n

Landing page animation<\/em><\/span><\/a><\/p>\n

\"capitoledge<\/p>\n

Capitoledge Screensaver<\/em><\/span><\/p>\n

\"design<\/p>\n

Bjorn Website<\/em><\/span><\/p>\n

 <\/p>\n

Problem: The screen\/page is boring.<\/span><\/h2>\n

Obviously, talking about interfaces, people often move the functional side and usability to the foreground, like a key or sometimes even the only aspect requiring consideration. And that’s right and logical, still, it cannot null the fact that people are driven not only by logic. There are also such big factors as emotional and aesthetic satisfaction able to influence user experience greatly. A thoughtful balance of utility and usability on the one hand with emotions and aesthetics on the other can bring user-friendly products. And the animation is a great booster in this perspective of interface design. It can mark out the beauty of colors<\/a> and gradients, breathe life into the layout, make movements dynamic or vice versa smooth, and strengthen the power of UI elements<\/a> with motion and original transitions.<\/span><\/p>\n

\"calendar<\/p>\n

Calendar App Animation<\/em><\/span><\/p>\n

\"ui<\/p>\n

Cafe Coupon App<\/em><\/span><\/p>\n

\"Contact<\/p>\n

Contact List Concept<\/em><\/span><\/p>\n

\"tubik<\/p>\n

Recipes App<\/em><\/span><\/p>\n

\"juicy-player<\/p>\n

Juicy Player<\/em><\/span><\/p>\n

 <\/p>\n

So, definitely, animation in user interfaces has massive potential in solving diverse problems of interaction. Still, even the slightest piece of motion added into UI requires a thoughtful approach to analyzing not only advantages but also possible drawbacks. Animation should support the user, that is its main goal in the interface.<\/span><\/p>\n

\"tubik-studio-quote\"<\/p>\n

 <\/p>\n

Recommended reading<\/span><\/h2>\n

The diverse issues of applying animation in UI design have been an object of professionals\u2019 attention for a considerable period. Here is the collection of articles for those who would like to read more on the topic.<\/span><\/p>\n

Motion in UX Design: 6 Effective Types of Web Animation<\/a><\/p>\n

How to Use Animation in Mobile Apps<\/a><\/p>\n

Conceptual Animation. Making UI Design Stand Out<\/a><\/p>\n

Interface Animation. The Force of Motion<\/a><\/span><\/p>\n

Animated Interactions. Motion on Purpose<\/a><\/span><\/p>\n

UI Animation. Microinteraction for Macroresult<\/a><\/span><\/p>\n

UI in Action. 15 Animated Design Concepts of Mobile UI<\/a><\/span><\/p>\n

5 Reasons to Make Animated Video for Your Product<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

The article analyzing problem-solving potential of animation in user interfaces. Types of problems users can have in UI interactions and animated solutions.<\/p>\n","protected":false},"author":3,"featured_media":8763,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[2,7,9],"tags":[319,466,532,323,469,533,324,479,534,329,482,545,331,483,336,485,16,337,486,20,339,489,100,340,491,147,411,493,151,437,498,212,447,502,233,457,504,256,458,505,258,463,507,269,465,515],"coauthors":[],"class_list":["post-2014","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-animation","category-processes_and_tools","category-ui_ux","tag-mobile-app","tag-ui-design-inspiration","tag-web-animation","tag-mobile-design-article","tag-ui-design-tips","tag-web-design","tag-mobile-design-inspiration","tag-usability","tag-web-design-article","tag-mobile-screens","tag-user-experience","tag-web-user-interface","tag-mobile-ui","tag-user-experience-article","tag-motion-design","tag-user-experience-design","tag-animation","tag-motion-design-article","tag-user-experience-design-article","tag-app-design","tag-motion-design-examples","tag-user-experience-examples","tag-design","tag-motion-design-process","tag-user-interface","tag-design-studio","tag-scroll-animation","tag-user-interface-design-process","tag-design-tips","tag-tips","tag-user-friendly","tag-graphic-design","tag-tubik-studio","tag-ux","tag-human-computer-interaction","tag-ui","tag-ux-design-article","tag-interaction-design","tag-ui-animation","tag-ux-design-best-practices","tag-interface-animation","tag-ui-design-article","tag-ux-design-examples","tag-ios-animation","tag-ui-design-examples","tag-uxui"],"acf":[],"yoast_head":"\nUI Animation: Eye-Pleasing, Problem-Solving<\/title>\n<meta name=\"description\" content=\"The article analyzing problem-solving potential of animation in user interfaces. Types of problems users can have in UI interactions and animated solutions.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"UI Animation: Eye-Pleasing, Problem-Solving\" \/>\n<meta property=\"og:description\" content=\"The article analyzing problem-solving potential of animation in user interfaces. Types of problems users can have in UI interactions and animated solutions.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/\" \/>\n<meta property=\"og:site_name\" content=\"Tubik Blog: Articles About Design\" \/>\n<meta property=\"article:published_time\" content=\"2016-10-07T13:34:01+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-08-16T09:19:44+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/blog.tubikstudio.com\/wp-content\/uploads\/2016\/10\/tubik_studio-ui-animation-design-article.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1440\" \/>\n\t<meta property=\"og:image:height\" content=\"1080\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Marina Yalanska\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Marina Yalanska\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"8 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/\",\"url\":\"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/\",\"name\":\"UI Animation: Eye-Pleasing, Problem-Solving\",\"isPartOf\":{\"@id\":\"https:\/\/tubikstudio.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/blog.tubikstudio.com\/wp-content\/uploads\/2016\/10\/tubik_studio-ui-animation-design-article.png\",\"datePublished\":\"2016-10-07T13:34:01+00:00\",\"dateModified\":\"2023-08-16T09:19:44+00:00\",\"author\":{\"@id\":\"https:\/\/tubikstudio.com\/blog\/#\/schema\/person\/320206b0076eb11ea0c0d4d17012c36f\"},\"description\":\"The article analyzing problem-solving potential of animation in user interfaces. Types of problems users can have in UI interactions and animated solutions.\",\"breadcrumb\":{\"@id\":\"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/#primaryimage\",\"url\":\"https:\/\/blog.tubikstudio.com\/wp-content\/uploads\/2016\/10\/tubik_studio-ui-animation-design-article.png\",\"contentUrl\":\"https:\/\/blog.tubikstudio.com\/wp-content\/uploads\/2016\/10\/tubik_studio-ui-animation-design-article.png\",\"width\":1440,\"height\":1080,\"caption\":\"tubikstudio ui animation design article\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/tubikstudio.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"UI Animation: Eye-Pleasing, Problem-Solving\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/tubikstudio.com\/blog\/#website\",\"url\":\"https:\/\/tubikstudio.com\/blog\/\",\"name\":\"Tubik Blog: Articles About Design\",\"description\":\"Tubik Studio\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/tubikstudio.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/tubikstudio.com\/blog\/#\/schema\/person\/320206b0076eb11ea0c0d4d17012c36f\",\"name\":\"Marina Yalanska\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/tubikstudio.com\/blog\/#\/schema\/person\/image\/2ddde1c118fcf989ce8e73997a3909dd\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/630af235953a586b42ed17f9ea472b131bcde00719efc655984d63ca2078e7a2?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/630af235953a586b42ed17f9ea472b131bcde00719efc655984d63ca2078e7a2?s=96&d=mm&r=g\",\"caption\":\"Marina Yalanska\"},\"url\":\"https:\/\/tubikstudio.com\/blog\/author\/marina-yalanska\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"UI Animation: Eye-Pleasing, Problem-Solving","description":"The article analyzing problem-solving potential of animation in user interfaces. Types of problems users can have in UI interactions and animated solutions.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/","og_locale":"en_US","og_type":"article","og_title":"UI Animation: Eye-Pleasing, Problem-Solving","og_description":"The article analyzing problem-solving potential of animation in user interfaces. Types of problems users can have in UI interactions and animated solutions.","og_url":"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/","og_site_name":"Tubik Blog: Articles About Design","article_published_time":"2016-10-07T13:34:01+00:00","article_modified_time":"2023-08-16T09:19:44+00:00","og_image":[{"width":1440,"height":1080,"url":"https:\/\/blog.tubikstudio.com\/wp-content\/uploads\/2016\/10\/tubik_studio-ui-animation-design-article.png","type":"image\/png"}],"author":"Marina Yalanska","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Marina Yalanska","Est. reading time":"8 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/","url":"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/","name":"UI Animation: Eye-Pleasing, Problem-Solving","isPartOf":{"@id":"https:\/\/tubikstudio.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/#primaryimage"},"image":{"@id":"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/#primaryimage"},"thumbnailUrl":"https:\/\/blog.tubikstudio.com\/wp-content\/uploads\/2016\/10\/tubik_studio-ui-animation-design-article.png","datePublished":"2016-10-07T13:34:01+00:00","dateModified":"2023-08-16T09:19:44+00:00","author":{"@id":"https:\/\/tubikstudio.com\/blog\/#\/schema\/person\/320206b0076eb11ea0c0d4d17012c36f"},"description":"The article analyzing problem-solving potential of animation in user interfaces. Types of problems users can have in UI interactions and animated solutions.","breadcrumb":{"@id":"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/#primaryimage","url":"https:\/\/blog.tubikstudio.com\/wp-content\/uploads\/2016\/10\/tubik_studio-ui-animation-design-article.png","contentUrl":"https:\/\/blog.tubikstudio.com\/wp-content\/uploads\/2016\/10\/tubik_studio-ui-animation-design-article.png","width":1440,"height":1080,"caption":"tubikstudio ui animation design article"},{"@type":"BreadcrumbList","@id":"https:\/\/tubikstudio.com\/blog\/ui-animation-eye-pleasing-problem-solving\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/tubikstudio.com\/blog\/"},{"@type":"ListItem","position":2,"name":"UI Animation: Eye-Pleasing, Problem-Solving"}]},{"@type":"WebSite","@id":"https:\/\/tubikstudio.com\/blog\/#website","url":"https:\/\/tubikstudio.com\/blog\/","name":"Tubik Blog: Articles About Design","description":"Tubik Studio","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/tubikstudio.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/tubikstudio.com\/blog\/#\/schema\/person\/320206b0076eb11ea0c0d4d17012c36f","name":"Marina Yalanska","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/tubikstudio.com\/blog\/#\/schema\/person\/image\/2ddde1c118fcf989ce8e73997a3909dd","url":"https:\/\/secure.gravatar.com\/avatar\/630af235953a586b42ed17f9ea472b131bcde00719efc655984d63ca2078e7a2?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/630af235953a586b42ed17f9ea472b131bcde00719efc655984d63ca2078e7a2?s=96&d=mm&r=g","caption":"Marina Yalanska"},"url":"https:\/\/tubikstudio.com\/blog\/author\/marina-yalanska\/"}]}},"post_mailing_queue_ids":[],"_links":{"self":[{"href":"https:\/\/tubikstudio.com\/blog\/wp-json\/wp\/v2\/posts\/2014","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tubikstudio.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/tubikstudio.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/tubikstudio.com\/blog\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/tubikstudio.com\/blog\/wp-json\/wp\/v2\/comments?post=2014"}],"version-history":[{"count":6,"href":"https:\/\/tubikstudio.com\/blog\/wp-json\/wp\/v2\/posts\/2014\/revisions"}],"predecessor-version":[{"id":14685,"href":"https:\/\/tubikstudio.com\/blog\/wp-json\/wp\/v2\/posts\/2014\/revisions\/14685"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/tubikstudio.com\/blog\/wp-json\/wp\/v2\/media\/8763"}],"wp:attachment":[{"href":"https:\/\/tubikstudio.com\/blog\/wp-json\/wp\/v2\/media?parent=2014"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tubikstudio.com\/blog\/wp-json\/wp\/v2\/categories?post=2014"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tubikstudio.com\/blog\/wp-json\/wp\/v2\/tags?post=2014"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/tubikstudio.com\/blog\/wp-json\/wp\/v2\/coauthors?post=2014"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}