{"id":6784,"date":"2016-11-10T19:26:45","date_gmt":"2016-11-10T19:26:45","guid":{"rendered":"https:\/\/itnigblog.live-website.com\/?p=6784"},"modified":"2020-06-11T13:16:04","modified_gmt":"2020-06-11T13:16:04","slug":"ux-ui-and-parties","status":"publish","type":"post","link":"https:\/\/itnig.net\/blog\/ux-ui-and-parties\/","title":{"rendered":"UX\/UI and parties"},"content":{"rendered":"<section class=\"section section--body section--first\">\n<div class=\"section-content\">\n<div class=\"section-inner sectionLayout--insetColumn\">\n<p id=\"9066\" class=\"graf graf--p graf-after--h4\">I usually start by saying that I\u2019ve been a designer for the last 15 years, UI designer. \u201cWhat\u2019s UI?\u201d I get that question a lot, can\u2019t help but smile.<\/p>\n<p id=\"9c1b\" class=\"graf graf--p graf--startsWithDoubleQuote graf-after--p\">\u201cUser Interface,\u201d I respond, trying to answer the question in a few words, \u201cis the visual part of\u00a0<strong class=\"markup--strong markup--p-strong\">an app<\/strong>. You see, the engineers will write the code, but most people can\u2019t read and understand the code, so the\u00a0<strong class=\"markup--strong markup--p-strong\">user interface<\/strong>\u00a0displays all that information in a way\u00a0<strong class=\"markup--strong markup--p-strong\">anyone<\/strong>\u00a0can understand. Or at least that\u2019s what good UI does, or tries to do.\u201d<\/p>\n<p id=\"9688\" class=\"graf graf--p graf-after--p\">We say\u00a0<em class=\"markup--em markup--p-em\">app<\/em>, although UI extends to the OS itself, and nowadays to anything with a screen. We say\u00a0<em class=\"markup--em markup--p-em\">anyone<\/em>, but what we really mean is anyone with a certain background\u200a\u2014\u200awhich might be really broad or really specific. We say\u00a0<em class=\"markup--em markup--p-em\">user interface<\/em>, when we actually mean\u00a0<em class=\"markup--em markup--p-em\">graphical user interface<\/em>; we lost the graphical in the rush of our daily lives.<\/p>\n<p id=\"a4fa\" class=\"graf graf--p graf--startsWithDoubleQuote graf-after--p\">\u201cSo you make apps look nice?\u201d It\u2019s pleasant when people are interested in what you do.<\/p>\n<p id=\"e203\" class=\"graf graf--p graf-after--p graf--trailing\">UI is entangled with UX, user experience. Which is how people interact with a tool, the feedback they receive, and the mental model: the way the human\u00a0<em class=\"markup--em markup--p-em\">thinks<\/em>\u00a0the machine operates, to name a few. UI is what you see, UX is everything that happens around it. The interface must be clear and beautiful, the experience direct and pleasant.<\/p>\n<hr \/>\n<p class=\"graf graf--p graf-after--p graf--trailing\">\n<\/div>\n<\/div>\n<\/section>\n<section class=\"section section--body\">\n<div class=\"section-content\">\n<div class=\"section-inner sectionLayout--insetColumn\">\nThrough the years I\u2019ve come to realize that I was always meant to do this for a living. Or perhaps I\u2019m so deep in this shit that it has changed who I am. I love visual arts, I enjoy enigmas and puzzles, and I strive to be as rational and objective as possible.<\/p>\n<p id=\"1f3d\" class=\"graf graf--p graf-after--p\">You\u2019ll recognize a UX\/UI designer because when faced with a complication in real life, they will stop to think about it for a second, ask a clarifying question about the usage, and then proceed to recommend something that could solve the problem. The solutions might include getting rid of something that\u2019s not useful, changing the location of certain things, or even wondering if the complication could be completely replaced with a simpler, more adequate thing.<\/p>\n<p id=\"9f48\" class=\"graf graf--p graf-after--p\">I was at a house party once\u200a\u2014\u200aI\u2019ve been to more parties, but they\u2019re not as relevant.<\/p>\n<p id=\"cf6d\" class=\"graf graf--p graf-after--p\">The hosts had an ample living room, but all the guests were hanging out in the kitchen (happens at all parties). So the room with the music was empty, and the kitchen was crowded, making it hard get a drink. They had an L-shaped couch in the middle of the living room, dividing the space in two, which is useful for watching movies and creating two spaces in one room. I mentioned to Theo that if we moved the couch, it would create more space, allowing people to stand there\u200a\u2014\u200aand even have room to dance. We moved it 90 degrees and pushed it against the corner\u200a\u2014\u200aa change in the user interface. The amount of seating didn\u2019t change, so we added a feature without losing another one in the process. Great!<\/p>\n<p id=\"82bb\" class=\"graf graf--p graf-after--p\">Then I turned my attention to the dinner table, that was still blocking part of the living room. I should\u2019ve suggested beer pong at the time\u200a\u2014\u200alet\u2019s call that v2\u200a\u2014\u200abut instead I suggested the same operation: turn it 90 degrees and put it against the wall. We also brought the spirits from the kitchen counter to that table, so those drinks were easier to access, freeing up the kitchen, and allowing beers to remain cold and accessible in the fridge. We changed the way you grab a drink (the user experience, that is), divided the most common actions (beers and cocktails) into two main categories with two different flows.<\/p>\n<p id=\"1c0c\" class=\"graf graf--p graf-after--p graf--trailing\">After this, the party was the same: the same conversations, same music, and same people. The contents remained unchanged, but it was more user friendly.<\/p>\n<p>&nbsp;\n<\/p><\/div>\n<\/div>\n<\/section>\n<section class=\"section section--body section--last\">\n<div class=\"section-content\">\n<div class=\"section-inner sectionLayout--insetColumn\">\n<hr \/>\n<p>&nbsp;<\/p>\n<p id=\"ae5f\" class=\"graf graf--p graf--leading\">A party,\u00a0<a class=\"markup--anchor markup--p-anchor\" href=\"https:\/\/medium.com\/building-asana\/design-process-at-asana-vol-1-crit-fc60eb66bca9#.o8fpjvxzu\" target=\"_blank\" rel=\"noopener noreferrer\" data-href=\"https:\/\/medium.com\/building-asana\/design-process-at-asana-vol-1-crit-fc60eb66bca9#.o8fpjvxzu\">an app<\/a>,\u00a0<a class=\"markup--anchor markup--p-anchor\" href=\"https:\/\/medium.com\/@TheWarcos\/how-to-improve-pedestrian-crossings-a45c4b893db6#.bxpvp8jpz\" target=\"_blank\" rel=\"noopener noreferrer\" data-href=\"https:\/\/medium.com\/@TheWarcos\/how-to-improve-pedestrian-crossings-a45c4b893db6#.bxpvp8jpz\">a pedestrian crossing<\/a>\u2026 In the startup world we might consider user interfaces just a part of the many in software, but simplifying and adjusting to our needs the way we interact with tools\u200a\u2014\u200aand other people\u200a\u2014\u200a, can always be positive. Next time you\u2019re faced with a complication think:<em class=\"markup--em markup--p-em\">Do I need it? Is it the best solution? Can it be simplified?<\/em><\/p>\n<p id=\"e780\" class=\"graf graf--p graf-after--p graf--trailing\">A staple can\u2019t get simpler, but you might not need it at all: a paper clip does a similar function and it\u2019s reusable. Or maybe you didn\u2019t even need to print that at all. And as I finish my drink and this paragraph, I wonder if I\u2019ve explained what UX\/UI design is effectively. What do you think?<\/p>\n<\/div>\n<\/div>\n<\/section>\n","protected":false},"excerpt":{"rendered":"<p>I usually start by saying that I\u2019ve been a designer for the last 15 years, UI designer. \u201cWhat\u2019s UI?\u201d I get that question a lot, can\u2019t help but smile. \u201cUser Interface,\u201d I respond, trying to answer the question in a few words, \u201cis the visual part of\u00a0an app. You see, the engineers will write the [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":6786,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[10],"tags":[],"class_list":["post-6784","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-technology"],"_links":{"self":[{"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/posts\/6784","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/comments?post=6784"}],"version-history":[{"count":1,"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/posts\/6784\/revisions"}],"predecessor-version":[{"id":9633,"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/posts\/6784\/revisions\/9633"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/itnig.net\/blog\/wp-json\/"}],"wp:attachment":[{"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/media?parent=6784"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/categories?post=6784"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/tags?post=6784"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}