Яндекс.Метрика

Дизайн-журнал №1. Актуальная информация для дизайнеров, веб дизайнеров, программистов и разработчиков сайтов.

Микровзаимодействия: секрет крутых приложений

14 апреля 2019 | Опубликовано в статьюшечки | 28 Комментариев »

У приложения есть две характеристики, которые делают его крутым: функции и детали. Функции привлекают пользователей, а детали заставляют его остаться с вами. Именно благодаря деталям продукт выделяется на фоне ему подобных. Микровзаимодействия — один из лучших инструментов обеспечить пользователям приятный опыт.

Современный дизайн ориентирован на человека. Именно вокруг пользователя сконцентрировано все происходящее. Микровзаимодействия часто воспринимаются как аксессуар, нечто второстепенное, но на деле благодаря им пользователь чувствует себя хорошо в приложении. Для дизайнера распознавать невидимые микровзаимодействия так же важно, как создавать их. Вам важно создать что-то человечное, и дать ощущение завершенности действия.

Что такое микровзаимодействия?

Микровзаимодействие выполняют в приложении одну маленькую задачу. Первым в своей книге описал микровзаимодействия Дан Саффер. Согласно ему, эти детали обычно выполняют следующие функции:

  • Создают ответную реакцию на действия пользователя.
  • Выполняют индивидуальное задание.
  • Повышают чувство прямого управления.
  • Помогают визуализировать результат действий и предотвратить ошибки.

Вот примеры микровзаимодействий:

  • Вибрация и иконка сайлент-режима, когда вы выключаете звук на iPhone.

  • Анимация в интерфейсе, которая показывает возможность клика и само нажатие.

Почему микровзаимодействия работают

Микровзаимодействия работают, потому что они удовлетворяют естественную потребность в подтверждении. Пользователи хотят знать, что их действие было выполнено и принято, и ждут визуальное подтверждение этому. Также микровзаимодействия помогут пользователю понять как работает система.

Возможности

Прелесть микровзаимодействий в том, что мы можем использовать их во множестве случаев, практически в любом действии. Если обобщить, то можно выделить список случаев, уместных для использования микровзаимодействий:

Демонстрация состояния системы

Первое эвристическое правило юзабилити Джейкоба Нельсена гласит: держите пользователя в курсе происходящего. Пользователь ожидает ответа на свое действие незамедлительно. Но бывают случаи, когда приложению необходимо больше времени для завершения операции.

В этих случаях интерфейс должен показывать пользователю что происходит в данный момент.


Полоса загрузки и скачивания.

Или же система может показывать пользователю где конкретно он находится:

Не давайте пользователю заскучать, держите его в курсе и показывайте прогресс (например, строки загрузки помогают пользователю ждать, и исключают недопонимания).

Подчеркивание изменений

Иногда нам нужно показать оповещение так, чтобы пользователь точно увидел его. Поможет анимация. Это привлечет внимание и поможет пользователю не пропустить важную информацию.

Чаще всего анимация используется для привлечения внимания. В этом отношении используйте KISS-принцип - микровзаимодействия должны быть маленькими и простыми.

Сохранение контекста

Используйте motion-эффекты, чтобы плавно перемещать пользователя по навигационному контенту, объясняя изменения в расположении элементов на экране. Это особенно важно для дизайна под мобильные устройства, потому что на маленьких экранах очень сложно разместить большое количество информации на одной странице.

Сделайте навигацию между разными страницами четкой, так чтобы пользователь понимал что появляется на экране и откуда. Переход между двумя визуальными состояниями должен быть понятным, плавным и непринужденным. Объедините микровзаимодействия в одну тему, чтобы они сочетались между собой.

Визуализация введенных данных

Введение данных — один из важнейших элементов любого приложения. Использование микровзаимодействий в этой области делает процесс увлекательным. Вы можете подать обратную связь очень интересными способами.

Микровзаимодействия помогают визуализировать информацию и достичь цели.

Призывы к действию

Микровзаимодействия подталкивают пользователя к непосредственному действию. Они добавляют увлекательности в пользовательский опыт. Но убедитесь, что визуальные эффекты и анимация подходят конкретно вашему сайту. И помните о долгосрочном использовании — не начнет ли микровзаимодействие раздражать на сотый раз, или же оно универсальное, понятное и ненавязчивое?

Подумайте об эмоциональной стороне дизайна. Эмоции играют огромную роль в пользовательских действиях. Учитывайте контекст и возможность взаимодействия в длительной перспективе.

Запомните

  • Микровзаимодействия работают как посредники для взаимодействия, обеспечивая фидбэк, оповещения и инструкции.
  • Микровзаимодействия должны экономить время, моментально предоставляя информацию нескучным способом, который не будет отвлекать пользователя. Они должны привлекать внимание как кокетливое подмигивание.
  • Знание вашего пользователя и контекста, стоящего за микровзаимодейтсвием поможет сделать его точнее и эффективнее.
  • Микровзаимодействия должны быть рассчитаны на длительное использование. То что сначала может показаться забавным, на сотый раз может вывести вас из себя.
  • Добавьте человечности микровзаимодействиям и сосредоточьтесь на визуальной гармонии. Движения должны быть плавными, чтобы добавить микровзаимодействиям жизни.

Выводы

Разрабатывайте с заботой. Думайте о том как люди работают с устройствами, и отражайте общий паттерн поведения в микровзаимодействиях. Внимание к каждой детали — ключ к успеху, человечности и простоте в использовании. Хороший дизайн должен пройти долгий путь от функциональности к микровзаимодействиях.

Автор статьи Nick Babich

Перевод — Дежурка

Смотрите также:




Комментарии

  1. Gr
    Thumb up Thumb down 0

    #ДежуркаЖиви

    Ответить

  2. Eve hunt
    Thumb up Thumb down 0

    "The attractiveness from the thing is that will locate

    no unwanted side effects reported, until now. "

    Regards: Eve Hunt

    Ответить

  3. Putin
    Thumb up Thumb down 0

    I have learn several good stuff here. Definitely value bookmarking for revisiting. I wonder how much effort you put to make the sort of magnificent informative site.

    Putin

    Ответить

  4. Merziuz
    Thumb up Thumb down 0

    Q7O1ki pills2sale.com viagra online

    Ответить

  5. Geraldo
    Thumb up Thumb down 0

    I'm doing a phd in chemistry where to buy viagra from uk The Knicks said the recovery time is approximately 12-to-16 weeks, which could put Smith in position to be available on opening night, but that seems unlikely since he won’t be practicing much in September and October.

    Ответить

  6. Patric
    Thumb up Thumb down 0

    Stolen credit card clopidogrel precio mexico This unidentified woman was photographed swimming off the coast of Mexico by legendary New York City photographer Art Kane. While many of his subjects were famous musicians like Bob Dylan and Aretha Franklin, this cover model’s name remains unknown. Kane committed suicide in 1995.

    Ответить

  7. Donny
    Thumb up Thumb down 0

    Photography plendil 10 mg. 30's Wall Street also singled out the company's growth abroad. It added 1.4 million customers in international markets, bringing its reach in foreign territories to 9.2 million, and said it will launch in unspecified new countries next year.

    Ответить

  8. Miquel
    Thumb up Thumb down 0

    A staff restaurant abilify doses 20 mg From plaid and pinstripes to cartoon prints and zigzags, Mo’s Bows span a wide range of styles. They come in men’s’ and boys’ sizes and sell for between $25 and $50 online, and in a handful of Southern boutiques.

    Ответить

  9. Mitchel
    Thumb up Thumb down 0

    What do you like doing in your spare time? ciprofloxacin ornidazole The Department for Work and Pensions “has lacked a detailed view of how Universal Credit is meant to work”, the NAO said, accusing the Coalition of failing to act on repeated warnings about the programme.

    Ответить

  10. Kieth
    Thumb up Thumb down 0

    Could you give me some smaller notes? is ethinyl estradiol levonorgestrel safe "In the case of Ms. Hackett, the IAAF has appealed the recent decision of the NAAA's Disciplinary Panel to exonerate Ms. Hackett and has also re-suspended her pending the appeal which is to be heard before the Court of Arbitration for Sport in Switzerland.

    Ответить

  11. Bruce
    Thumb up Thumb down 0

    Could I have a statement, please? benadryl congestion relief review Audiences were enthralled not only by Everett, but by a play which hilariously and movingly trained a microscope on the English Establishment. Mitchell had been spurred on by the pontifications of newspaper columnists. “They didn’t make the connection between the gayness and the treason. It’s quite different wanting to join the communist party and change the world, and wanting to betray your country.”

    Ответить

  12. Leland
    Thumb up Thumb down 0

    I don't know what I want to do after university asphaton qarshi in urdu Kenny has vowed that any lawmaker who opposes the bill from his own conservative party will be expelled from his parliamentary bloc and be barred from running as Fine Gael candidates at the next election. So far just four of his 74 party lawmakers have defied him and suffered the punishment.

    Ответить

  13. Katelyn
    Thumb up Thumb down 0

    I'd like to speak to someone about a mortgage clomid to get a girl "The sea is full of bodies, it's a horror without end, " said the island's Mayor Giusi Nicolini in tears as victims were brought to quayside. "How much longer can this go on? This had to stop, " she told Italian TV.

    Ответить

  14. Jermaine
    Thumb up Thumb down 0

    Another year atorvastatin 10 mg cost walmart Vincenzo Rusciano, whose niece Annalisa was among the survivors, said she had told him the bus suffered a burst tire as it approached the flyover, which crosses between wooded hills and spans hazelnut groves above Naples. The bus careered wildly, crashing into cars on the flyover before slamming into, and smashing through the concrete barrier, leaving 15 motorists injured.

    Ответить

  15. Jesus
    Thumb up Thumb down 0

    Where do you come from? where can i purchase levitra online JAKARTA, Aug 14 (Reuters) — Indonesia's anti-graft agency onWednesday arrested the head of the energy regulator to probeallegations he took more than half a million dollars from an oilfirm, piling more uncertainty on energy policy in SoutheastAsia's biggest economy.

    Ответить

  16. jatayfzpzi
    Thumb up Thumb down 0

    KRDTmN idajoiniuvpg, [url=http://okfckwjhvcao.com/]okfckwjhvcao[/url], [link=http://berbbcszvamn.com/]berbbcszvamn[/link], rjqwsknwjczj.com

    Ответить

  17. Silas
    Thumb up Thumb down 0

    I don't know what I want to do after university syndes.biz/ejemplo-de-tesis-derecho-usac-imod overuse of cell phones essay 150 words Hacking is not a crime in and of itself. So-called white-hathackers, who access computers to bolster security defences, faceoff at the front lines of a virtual battleground with criminals,known as crackers or black-hat hackers, who break in with illintent.

    Ответить

  18. Davis
    Thumb up Thumb down 0

    A First Class stamp blog.sexcoolture.com/stma...ergoline.mevacor target minoxidil vs rogaine One of the hospitals is a facility for veterans; another has a Catholic affiliation and does not grant privileges to abortion providers. The third requires a doctor to admit at least five patients a year to gain privileges.

    Ответить

  19. Courtney
    Thumb up Thumb down 0

    Who would I report to? www.invertermitsubishisho...heumatrex.norvir paracetamol infantil cuantas gotas por kilo Earlier this month, health insurers complained of problems displaying basic information about the plans they will sell on federally run exchanges in 36 states. Among states that will run their own exchanges, Colorado, Oregon and the District of Columbia pared back their launches to address technical problems.

    Ответить

  20. Ulysses
    Thumb up Thumb down 0

    perfect design thanks twinforms.com/products/in....levitra.benemid ventolin leg cramps Miller plans to keep playing for at least a couple more years, saying that he feels better now than he has in several seasons. He expressed disappointment that not only will he not get to help the Heat try for a third straight title, he will no longer be playing alongside Udonis Haslem, his former college teammate at Florida.

    Ответить

  21. Lynwood
    Thumb up Thumb down 0

    I'm doing a phd in chemistry news.erboristeriavarvara....evitra.tadalista wellbutrin xl and prozac taken together After a sometimes fiery debate in the upper house, in which he faced repeated accusations of sowing chaos in a personal bid to stave off expulsion from parliament over a tax fraud conviction, Berlusconi said: "We have decided, not without some internal strife, to support the government. "

    Ответить

  22. Jamie
    Thumb up Thumb down 0

    Would you like a receipt? www.invertermitsubishisho....serevent.cialis ciprofloxacin hcl 500mg used for tooth infection Philips has brought the world’s first laser-guided beard trimmer to IFA. The Beard Trimmer 9000′s pop-out laser casts a red line in perfect level with its cutting elements on to your face so that your Craig David beard will be sharp enough to score glass.

    Ответить

  23. Roscoe
    Thumb up Thumb down 0

    A pension scheme www.kurusurin-coop.com/ma...n.prozac.levitra arava 20 mg cost Last month, a majority of EU member states agreed that thewarnings should cover just 65 percent of packets, while somemembers parliament have called for warnings as small as 50percent. Florenz predicts that the parliament and governmentswill eventually settle for a compromise of 60 percent.

    Ответить

  24. Kermit
    Thumb up Thumb down 0

    I'm doing a masters in law www.amautokey.com/stmap_5....cytoxan.emulgel viagra zamienniki cena The bigger risk, she and others caution, is that to avoid social unrest Beijing refuses to tolerate such pain, instead encouraging banks to keep troubled borrowers afloat by rolling over their loans like Japan's banks did in the 1990s, preventing them from lending to profitable new ventures that could revive growth.

    Ответить

  25. Bryant
    Thumb up Thumb down 0

    Pleased to meet you www.amautokey.com/stmap_5...ivil.mebendazole flomax vs terazosin But this is the America's Cup, Silicon Valley's style -it's all about technology, ideas and information — and advancesmade in preparation for the races are already being felt intelevision, aerospace and sporting gear.

    Ответить

  26. Nicolas
    Thumb up Thumb down 0

    A Second Class stamp zamin-travel.com/stmap_82...l.xalatan.viagra paracetamol 500 mg opinie Another intern living at Claredale claimed that Mr Erhardt, who had been earning £2,700 a month or £45,000 pro rata, collapsed from exhaustion. “He apparently pulled eight all-nighters in two weeks. They get you working crazy hours and maybe it was just too much for him in the end, ” they said.

    Ответить

  27. Angelo
    Thumb up Thumb down 0

    I saw your advert in the paper www.wmrwcpas.com/stmap_82...gra.prednisolone topiramate weight loss drug Amber Heard made her red-carpet debut with her girlfriend of two years, photographer and artist Tasya van Ree, at GLAAD's 25th anniversary celebration. 'I think GLAAD is one of the many reasons that I, as a 24-year-old, can come out,' the 'Pineapple Express' actress told AfterEllen.com following the event. The actress explained that if she continued to hide her sexuality, she was inadvertently admitting it is wrong. 'I don't feel like I'm wrong,' she told the website. 'I don't feel like millions of people are wrong because they love who they love or they were born how they were born.'

    Ответить

  28. Sergio
    Thumb up Thumb down 0

    Could I make an appointment to see ? aquajewellers.com/stmap_1...zole.glimepiride interaction between ibuprofen and omeprazole Manning's lawyers were expected to argue that the Army private was not trying to jeopardize U.S. national security. He did not testify during his trial or during the first day of his sentencing hearing.

    Ответить

Оставить ответ


+ три = 4

Вставить изображение