{"id":10052772,"date":"2020-03-02T15:49:40","date_gmt":"2020-03-02T13:49:40","guid":{"rendered":"https:\/\/www.fh-joanneum.at\/?post_type=projects&#038;p=52772"},"modified":"2020-03-02T15:49:40","modified_gmt":"2020-03-02T13:49:40","slug":"little-big-interactions-micro-interactions","status":"publish","type":"project","link":"https:\/\/www.fh-joanneum.at\/en\/project\/little-big-interactions-micro-interactions\/","title":{"rendered":"Little Big Interactions | Micro interactions"},"content":{"rendered":"<div class=\"wp-block-sidebar-layout-container margin-bottom-normal\">\n    <div\n        class=\"container-lg\"\n        style=\"--bs-gutter-x: 0;\"\n    >\n        <div\n            class=\"row\"\n            style=\"--bs-gutter-x: 0;\"\n        >\n            \n<div class=\"col-12 col-md-3 order-1 order-md-0 sidebar\">\n            \n<div\n    id=\"\"\n    class=\"wp-block-institute-card margin-bottom-normal\"\n>\n    <div class=\"container-lg\">\n                                    <div class=\"row justify-content-around\">\n                    <div class=\"col-8 col-sm-6 col-md-12\">\n                        <a\n        class=\"medien-und-design institute-card\"\n        href=\"https:\/\/www.fh-joanneum.at\/en\/institute\/design-communication\/\"\n        target=\"_self\"\n    >\n                            <div class=\"major-bg-color\">\n            <div class=\"wrapper\">\n                <div class=\"header\">\n                    <span>Institute<\/span>\n                <\/div>\n                <h4>Design &amp; Communication<\/h4>\n            <\/div>\n        <\/div>\n            <span><\/span>\n                    <\/a>\n                    <\/div>\n                <\/div>\n                        <\/div>\n<\/div>\n\n<div id=\"\" class=\"wp-block-fact-box margin-bottom-normal\">\n  <div class=\"container-lg\">\n        <div class=\"row justify-content-around\">\n            <div class=\"col-8 col-sm-6 col-md-12\">\n                <div class=\"card border border-light p-3\">\n                    <ul class=\"list-unstyled mb-0\">\n                                              <li\n                          class=\"mb-2\"\n                        >\n                          <div class=\"label mb-1\">\n                            Master\\&#039;s thesis\n                          <\/div>\n                          <div class=\"value fw-bold\">2018<\/div>\n                        <\/li>\n                                              <li\n                          class=\"mb-2\"\n                        >\n                          <div class=\"label mb-1\">\n                            Author\n                          <\/div>\n                          <div class=\"value fw-bold\">Thomas Mirnig<\/div>\n                        <\/li>\n                                              <li\n                          class=\"mb-2\"\n                        >\n                          <div class=\"label mb-1\">\n                            Supervisor\n                          <\/div>\n                          <div class=\"value fw-bold\">Matthias Kampitsch<\/div>\n                        <\/li>\n                                              <li\n                          class=\"\"\n                        >\n                          <div class=\"label mb-1\">\n                            Master\n                          <\/div>\n                          <div class=\"value fw-bold\">Communication Design<\/div>\n                        <\/li>\n                                          <\/ul>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>\n\n\n<\/div>\n\n<div class=\"d-none d-md-flex col-md-1 seperator-column\"><\/div>\n<div class=\"col-12 col-md-8 order-0 order-md-1\">\n     \n<div id=\"\" class=\"wp-block-text-content margin-bottom-normal\">\n    <div class=\"container-lg\">\n        <div class=\"row\">\n            <div class=\"col\">\n                <p>User interfaces serve the purpose of simplifying the interaction between hardware and software, and making it understandable in the first place. All interfaces have one characteristic in common: in order to work properly, the user must understand them. One key feature is particularly important here: the feedback the interface provides to the user through their interaction.<\/p>\n<p>Micro interactions constitute one concept for that: short and concise interactions which can be expressed visually, acoustically, or even haptically. They are the small, elegant and often lovingly designed animations used in our favorite apps. In a nutshell, micro interactions are functional, interactive details which make up a (digital) product.<\/p>\n<p><a href=\"http:\/\/www.thomasmirnig.com\" target=\"_blank\" rel=\"noopener noreferrer\">www.thomasmirnig.com<\/a><\/p>\n\n            <\/div>\n        <\/div>\n            <\/div>\n<\/div>\n\n<div\n    id=\"\"\n    class=\"wp-block-image-slider margin-bottom-normal\"\n>\n    <div class=\"container-lg\">\n        <div class=\"row\">\n            <div class=\"col-12\">\n                <div class=\"swiper-outer-wrapper\">\n                    <div class=\"image-header\">\n                        <div class=\"swiper-navigation\">\n                            <div class=\"swiper-button-prev-custom\">\n                                <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"9\" height=\"14\" viewBox=\"0 0 9 14\" fill=\"none\">\n  <path d=\"M8 13L2 7L8 1\" stroke=\"\" stroke-width=\"1.5\" stroke-linecap=\"round\"\/>\n<\/svg>                            <\/div>\n                            <div class=\"swiper-button-next-custom\">\n                                <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"9\" height=\"14\" viewBox=\"0 0 9 14\" fill=\"none\">\n  <path d=\"M1 1L7 7L1 13\" stroke=\"\" stroke-width=\"1.5\" stroke-linecap=\"round\"\/>\n<\/svg>                            <\/div>\n                        <\/div>\n                    <\/div>\n                    <div class=\"swiper image-slider-swiper\">\n                        <div class=\"swiper-wrapper\">\n                                                                                                <div class=\"swiper-slide item\">\n                                        <picture>\n                        <source\n                media=\"(max-width: 576px)\"\n                srcset=\"https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-2.jpg, https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-2-768x768.jpg 2x\"\n            \/>\n                    <source\n                media=\"(max-width: 768px)\"\n                srcset=\"https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-2-768x768.jpg, https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-2-1024x1024.jpg 2x\"\n            \/>\n                    <source\n                media=\"(max-width: 1024px)\"\n                srcset=\"https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-2-1024x1024.jpg, https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-2.jpg 2x\"\n            \/>\n                    <source\n                media=\"(max-width: 1536px)\"\n                srcset=\"https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-2.jpg, https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-2.jpg 2x\"\n            \/>\n                    <source\n                media=\"(max-width: 2000px)\"\n                srcset=\"https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-2.jpg, https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-2.jpg 2x\"\n            \/>\n                <img decoding=\"async\"\n        class=\"img-fluid\"\n        src=\"https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-2.jpg\"\n        alt=\"Little Big Interactions | Micro interactions 1\"\n        title=\"\"\n         loading=\"lazy\"             >\n<\/picture>\n\n                                                                            <\/div>\n                                                                    <div class=\"swiper-slide item\">\n                                        <picture>\n                        <source\n                media=\"(max-width: 576px)\"\n                srcset=\"https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-3.jpg, https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-3-768x768.jpg 2x\"\n            \/>\n                    <source\n                media=\"(max-width: 768px)\"\n                srcset=\"https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-3-768x768.jpg, https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-3-1024x1024.jpg 2x\"\n            \/>\n                    <source\n                media=\"(max-width: 1024px)\"\n                srcset=\"https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-3-1024x1024.jpg, https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-3.jpg 2x\"\n            \/>\n                    <source\n                media=\"(max-width: 1536px)\"\n                srcset=\"https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-3.jpg, https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-3.jpg 2x\"\n            \/>\n                    <source\n                media=\"(max-width: 2000px)\"\n                srcset=\"https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-3.jpg, https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-3.jpg 2x\"\n            \/>\n                <img decoding=\"async\"\n        class=\"img-fluid\"\n        src=\"https:\/\/cdn3.fh-joanneum.at\/media\/2020\/02\/little-big-interactions-micro-interactions-3.jpg\"\n        alt=\"Little Big Interactions | Micro interactions 2\"\n        title=\"\"\n         loading=\"lazy\"             >\n<\/picture>\n\n                                                                            <\/div>\n                                                                                    <\/div>\n                    <\/div>\n\n                    <div class=\"swiper-navigation-pagination\">\n                        <div class=\"swiper-button-prev-custom\">\n                            <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"9\" height=\"14\" viewBox=\"0 0 9 14\" fill=\"none\">\n  <path d=\"M8 13L2 7L8 1\" stroke=\"\" stroke-width=\"1.5\" stroke-linecap=\"round\"\/>\n<\/svg>                        <\/div>\n                        <div class=\"swiper-pagination\"><\/div>\n                        <div class=\"swiper-button-next-custom\">\n                            <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"9\" height=\"14\" viewBox=\"0 0 9 14\" fill=\"none\">\n  <path d=\"M1 1L7 7L1 13\" stroke=\"\" stroke-width=\"1.5\" stroke-linecap=\"round\"\/>\n<\/svg>                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>\n\n\n<\/div>\n\n\n        <\/div>\n    <\/div>\n<\/div>\n\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":26,"featured_media":10052767,"template":"","meta":{"_acf_changed":false,"footnotes":""},"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.fh-joanneum.at\/en\/wp-json\/wp\/v2\/project\/10052772"}],"collection":[{"href":"https:\/\/www.fh-joanneum.at\/en\/wp-json\/wp\/v2\/project"}],"about":[{"href":"https:\/\/www.fh-joanneum.at\/en\/wp-json\/wp\/v2\/types\/project"}],"author":[{"embeddable":true,"href":"https:\/\/www.fh-joanneum.at\/en\/wp-json\/wp\/v2\/users\/26"}],"version-history":[{"count":0,"href":"https:\/\/www.fh-joanneum.at\/en\/wp-json\/wp\/v2\/project\/10052772\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.fh-joanneum.at\/en\/wp-json\/wp\/v2\/media\/10052767"}],"wp:attachment":[{"href":"https:\/\/www.fh-joanneum.at\/en\/wp-json\/wp\/v2\/media?parent=10052772"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}