Фрэнк Ллойд Райт (Frank Lloyd Wright) на столетие опередил собственный время. Он был пионером авангардной архитектуры, вырвавшимся из традиций эры. Особенное видение формы, материалов, функций, окружающей среды и пространства выяснило его знаковые работы.
принципы и Эти идеалы до сих пор употребляются в архитектуре, а его строения выдержали опробование временем, оставаясь актуальными в современную эру цифровых разработок.
В бессмертных работах Райта возможно почерпнуть много воодушевления. От разработчиков довольно часто требуются проекты цифрового сотрудничества (digital experience) в программном обеспечении, жизненный цикл которого — от 5 до 10 лет. Это вечность для информационной эры, что заставляет задуматься о будущем. Какие конкретно устройства люди будут применять в ближайшие пара десятилетий?
Какие конкретно модели сотрудничества будут использоваться через 25-50 лет?
в течении всей собственной 70-летней карьеры Райт разрабатывал последовательность правил, шесть из которых возможно использовать и в digital-дизайне. Его упрочнения, направленные на создание «новой» архитектуры, в совокупности с его взорами на материалы, планировку, формы, функции, и связи между целым, его окружающей средой и частями — все это способно послужить толчком к переосмыслению подходов в digital-проектировании.
- Ключевые принципы проектирования пользовательского опыта
Потребность в новой архитектуре
Ни при каких обстоятельствах не нужно усложнять дизайн во благо новизны либо жажды поразить. Сам Райт всецело упразднил такую практику в собственных работах. В предисловии к Studies and Executed Buildings он говорит: «Я ни капли не верю в украшение лишь для украшения.
Если оно не додаёт ясности в раскрытие заявленной идеи, то его добавление малопонятно, и исходя из этого нежелательно».
Викторианская эра и ее легкомысленный стиль
Райт начал собственную карьеру на пике викторианской эры. Главное направление американской архитектуры заключало в себе хорошие отвлечённые традиции Европы. Викторианские дома представляли собой не просто жилища, а выставочные залы личного благосостояния. Непоследовательно покрытые орнаментом и складывающиеся из множества мелких помещений, они создавались без какого-либо функционального плана:
Викторианская архитектура в Сан-Франциско
По словам Райта, «казалось обычным желание выстроить что-либо, поднимающееся на дыбы и бьющее лапами воздушное пространство — в знак того, что вы выглядите более солидно, чем ваш сосед». Помимо этого, согласно его точке зрения, в этих строениях находилось мало воображения: архитектор имел возможность выбрать любой шаблон из актуального альбома и «добавить в него женский эркер».
Заря новой архитектуры
В течение 1880-х и 1890-х годов Райт осознавал необходимость новой архитектуры. На рубеже столетий его идеи получили голос. Райт отказался от поверхностных викторианских традиций того времени и основал новое, американское архитектурное перемещение — «Школу Прерий» (Prairie School).
В соответствии с плану «Школы», каждое строение должно помогать цели, и любая его подробность должна быть шепетильно спланирована в поддержку данной цели. Подробности должны были определять эстетический стиль строения:
Дом Фредерика С. Роби
Один из примеров динамичной функциональной формы виден в доме Фредерика С. Роби, спроектированном Райтом. Отличительная черта этого строения — его преувеличенные ступенчатые линии и карнизы крыши. Их главное назначение — снабжать тенью солидную часть дома в течение жаркого лета на Среднем Западе, являясь одновременно с этим главной подробностью, определяющей эстетику строения.
Кроме этого они дают чувство защищенности на протяжении нередких штормов и других тяжелых погодных условий.
Подробности со значением
Проектируя отель «Империал» (Imperial Hotel) в Токио, городе, склонном в то время к нередким пожарам — Райт включил в проект зеркальные бассейны, каковые при необходимости имели возможность являться резервуарами для тушения пожара. Будучи эстетически идеальными, одновременно с этим эти бассейны помогали куда более ответственной цели:
Зеркальные бассейны у фасада отеля «Империал»
Современные дизайнеры кроме этого вовлечены в создание прекрасных, привлекательных, практичных вещей, каковые отвечают потребностям пользователей и помогают намного громадным целям, чем привлекательность и красота.
Не требуется чрезмерно усложнять проекты либо применять визуальные стили в угоду моде. В итоге, удивлять сотрудников по цеху — не есть задачей дизайнера. Вместо этого, каждое решение должно помогать цели, поддерживающей исходные требования UX и задачи бизнеса.
- 5 правил визуальной привлекательности современного веб-дизайна
Познание природы материалов
Райт уделял внимание применяемым материалам. Его выбор основывался на их прочности и природных свойствах. К примеру, стекло пропускает свет; бетон возможно жидким и наливаться в форму.
Камень жёсток, как и кирпич. Райт был раздосадован тем, как другие архитекторы поступают с материалами. Они пренебрегали природой каждого из них, и применяли материалы, как словно бы те были одного и того же качества. Райт ощущал, что лучшее ответ — разрешить материалу существовать в его естественной форме, нежели изменять его поверхностно.
К примеру, древесина имеет личные цвет и структуру, она одновременно прочная и эластичная. Окрашивание либо резьба не оказывают громадной чести ее несложным природным качествам: Райт счел бы это примером избыточного дизайна.
Сочетание материалов
Глубокое познание материалов дало Райту свободу в удовлетворении потребностей его клиентов. На протяжении проектирования штаб-квартиры компании Johnson Wax в Расине, штат Висконсин, он объединил материалы инновационным методом. Одной из задач проекта было повышение пропускной свойстве и свободы передвижения по всему строению.
Райт создал изолированную среду с просторной открытой планировкой, залитую естественным светом и поддерживаемую изнутри «сосновым лесом» колонн.
Древовидные колонны в главном офисе Johnson Wax
Древовидные колонны Райта складывались из широких вершин и узких оснований; казалось, словно бы они бросают вызов гравитации. Скептически настроенные инженеры предвещали провал проекта. Глубокое знание их свойств и материалов разрешило Райту спроектировать эти колонны так, что, владея прочной структурой, они не заставляли выбирать между открытым пространством и свободой передвижения.
Революционный проект офисного этажа содействовал повышению производительности труда на 25%.
Технологии: палитра материалов
В отечественном цифровом мире различные устройства предлагают разные комбинации возможностей и технологий. Эти технологии возможно использовать в дизайне совершенно верно так же, как Райт применял материалы для грандиозных сооружений.
Представьте, что технологии устройства — это перечень архитектурных материалов. К примеру, устройство может иметь экран, акселерометр, разработку тактильного отклика Haptic, NFC и GPS. Как дерево владеет естественной структурой и есть прочным и эластичным, так и haptic-устройство предлагает колебательный отклик с разными промежутками, а акселерометр — определяет неожиданное перемещение.
Как правило, прикрываясь многозадачностью, разработками злоупотребляют таким же образом, как современники Райта злоупотребляли материалами. В случае если думать шире, другими словами возможность заметить методы применения естественных особенностей этих разработок, либо «материалов», для более привлекательного, захватывающего цифрового сотрудничества, превосходящего исходные требования-и бизнес цели UX.
Возможно поступать так же, как поступал Райт, проектируя штаб-квартиру Johnson Wax — комбинировать материалы уникальными, инновационными методами. Хорошим примером есть Cycloramic. Это приложение формирует 360-градусные панорамные фотографии без помощи рук. На iPhone 5 приложению требуется, дабы телефон стоял вертикально на плоском крае. Вибрации, создаваемые механизмом тактильного отклика, поворачивают устройство, тогда как окружающее пространство фиксируется камерой.
Результатом есть совершенное панорамное фото.
Еще более инновационно ответ Cycloramic для iPhone 6, что неимеетвозможности находиться вертикально, поскольку имеет закругленные края. Создатели приложения предлагают применять зарядное устройство в качестве держателя телефона.
Cycloramic на iPhone 6
Новые Apple Watch смогут вызвать золотую лихорадку на рынке приложений. Подобно домовладельцам викторианской эры, компании будут создавать приложения для этих часов, лишь дабы «не отстать от Джонсов». Они смогут кроме того не помогать определенной цели.
Но в успешных и прекрасно продуманных приложениях будут использованы главные разработки часов, такие как haptic-разработка, NFC, пульсометр либо переводная головка.
- 3 принципа научного дизайна: лендинг для красоты либо конверсии
Свободное и открытое жизненное пространство
В отличие от своих викторианских предшественников, «дома прерий» Райта складывались из открытых замыслов, расположенных около центральной точки. Вместо классических помещений, Райт был уверенный в необходимости создания эластичных, многофункциональных пространств. Эти открытые пространства, либо возможности, были шепетильно созданы, дабы руководить перемещением людей в и за пределами дома.
В следствии, территории дома становились более дешёвыми для его жителей. Пространство в доме проектировалось так, дабы воздух и свет проникали через всю конструкцию как единое целое. Вместо твёрдых стен, зонирование осуществлялось посредством «экранов», каковые могли быть сделаны из чего угодно: от мебели (как в доме Роби) до целых окон.
Райт думал, что спасение от коробок помещений разрешило ему сделать пространство более «человеческим», с меньшим местом, израсходованным впустую на конструкции, и громадным — покинутым для жизни. В интервью с Майком Уоллесом он объявил, что приобретал письма от своих клиентов, показывающие, что данный подход поменял уровень качества их жизни.
дизайнеры и Разработчики также будут вдохновиться правилами планировки Райта. В дополнение (но не исключение) к применяемым основным правилам, к примеру, иерархии, цветовому балансу и контрасту, порядку чтения (т.е. слева направо) — возможно применять взоры Райта на пространство и форму, дабы продвинуть проектную работу в новых направлениях. Экран есть самой популярной разработкой (либо материалом, по терминологии Райта) из находящихся в распоряжении разработчиков, но в большинстве случаев, его возможности не употребляются полностью.
Перегруженность информацией: что не нужно делать
Чем больше информации делается дешёвой, тем чаще пользователи нуждаются в доступе к ней при помощи веб-программного обеспечения и сайтов. По данной причине среди разработчиков существует тенденция «втискивать» данные в собственные проекты, что в конечном счете ведет к добавлению все большего количества модулей, панелей, а также экранов.
Дополнительные экраны — это неестественная нагрузка на поисковые возможности и информационную архитектуру. Ненужность таковой проектной модели очевидна в уровнях навигации многих приложений. Кое-какие панели навигации занимают кроме того больше места, чем нужный контент. Это цифровой эквивалент ограниченного, похожего на коробку викторианского дома:
Скетч, демонстрирующий перегруженный интерфейс
Возможно было бы сделать экран более долгим, но таковой движение только стал бы причиной повышение контента, что не есть ответом изначальной неприятности. Довольно часто мы не полностью используем естественные возможности экрана. Дабы сделать это, направляться признать: любое дополнение должно соответствовать определенному UX-требованию либо бизнес-задаче.
После этого необходимо оценить, как оно соответствует дизайну на глобальном уровне.
- Дизайн лендингов: преимущества минимализма с позиций психологии восприятия
Использование совершенств Райта в digital-проектировании
Пространство проекта не содержится в физической поверхности экрана, как и не исчерпывается плоскостью, находящейся под дисплеем устройства. Экран направляться разглядывать как окно в мир, являющееся продолжением отечественного собственного 3D-мира. Это виртуальное пространство так же обширно, как и ландшафт прерий, ранее вдохновивших работы Райта.
Экран направляться разглядывать как окно в мир, являющееся продолжением отечественного собственного 3D-мира
Твитнуть цитату
Как пространство в зданиях Райта, контент стоит объединять в формы, разрешающие ему вольно течь (natural flow) и быть максимально дешёвым.
Существует пара направлений для работы в этом огромном виртуальном пространстве, открывающих новые площади для размещения информации. Размещение контента не должно быть произвольным, и тогда полученная в следствии форма делается определенной по содержанию, простой по собственной сути и не существует «лишь для красоты».
Данное видео демонмтрирует инструмент, что компания Space X создала для проектирования подробностей космических ракет. В связи с тем, что ракетные двигатели оснащены множеством сложных подробностей, любая из которых должна быть шепетильно спроектирована, настроена и отлажена, логично высказать предположение, что как на скетче выше, экран должен был быть загроможден разными меню, настройками и опциями.
Но вместо этого релевантная информация появляется в контексте, соответствующем выбранной подробности. Подобно открытым возможностям в «зданиях прерий», интерфейс, а правильнее — его отсутствие, объединен с открытой планировкой инструментария, что разрешает инженеру вольно перемещаться по виртуальной чертежной доске и править двигатель практически на лету. Это красивый пример того, как сложная информация возможно организована в несложную, интуитивно понятную форму.
Помимо этого, в качестве метода ввода Space X применяли Leap Motion Controller – разработку, делающую работу с инструментарием еще более естественной, разрешая инженеру «лепить» двигатель собственными руками.
- Интуитивный веб-дизайн: как сделать лендинг пейдж удобным для пользователя
назначения и Единство формы
Наставник Райта, Луис Салливан, прославился фразой в собственной статье «Признание художественной сокровище небоскребов» (The Tall Office Building Artistically Considered), которая звучала так: «Форма всегда следует за делаемой функцией».
Иначе говоря форма строения обязана определяться его назначением. Эта мысль уже некое время витала в воздухе, как наследие совершенств Марка Витрувия Полло — инженера римского и раннего архитектора, написавшего «Десять книг об архитектуре».
Райт продолжил переосмысление хорошей идеи о «функции и форме, что должны слиться в духовном альянсе», и это дало ему громадную свободу в архитектурных ответах.
Очертания «домов прерий» были обусловлены их назначением: дать укромное, но просторное убежище от жёстких условий Среднего Запада. С целью достижения чувства уединенности и уюта вся структура строения приводилась к «людским» пропорциям.
Потолки и скаты крыши были занижены, главные помещения размешались на плите, немного поднятой над холодной почвой прерии. Спальни и кладовые считались второстепенными, и исходя из этого размещались на верхнем уровне. подсобные помещения и Кухня имели возможность примыкать к главным, по необходимости. Главные помещения представляли собой, в большинстве случаев, долгие открытые галереи.
Как уже упоминалось, линии крыши проектировались преувеличенно выступающими, снабжая тень, тогда как ровные последовательности подвешенных окон пропускали максимум света в жилые помещения.
Дом Майера Мэя: L-образная проектировка, выступающие галереи и карнизы подвешенных окон
Контент, форма и UI как единое целое
В дополнение к формообразующим правилам, вышеупомянутым, возможно сделать дизайн-проект еще легче, тесно связав контент, его пользовательский интерфейс и форму в единую совокупность.
Сейчас интерфейс и контент, в большинстве случаев, сосуществуют, и время от времени между ними появляется несоответствие. Кроме этого не следует жертвовать удобством применения: правила UI неизменно должны быть очевидны. Функциональная обусловленность формы разрешит создать четкую когнитивную схему содержания.
Информация неизменно должна быть дешева через последовательную модель сотрудничества, что делает опыт более естественным.
функция и Форма элегантно объединены в умном термостате Nest. Вместо того, дабы загромождать экран элементами управления UI и кнопками, разработчики придали физическому устройству цилиндрическую форму — так же как и интерфейсу, что может поворачиваться для других функций и регулирования температуры. Сенсоры термостата запоминают предпочтения обладателя и машинально устанавливают температуру в зависимости от времени дней, настроек и расположения.
Применение дополнительных разработок, либо «материалов», снизило информационную нагрузку, в другом случае загромоздившую бы интерфейс пользователя.
Контекстная информация — это координационный центр, всецело интегрируемый в его взаимодействие и дизайн продукта с пользователем. Форма термостата — хороший пример того, как содержание, пользовательский интерфейс и форма сливаются воедино, одновременно с этим напоминая применяемый в прошлом аналоговый поворотный регулятор.
В зависимости от того, какую форму принимает контент, возможно целесообразным создание физических слоев информации. Доступ к этим слоям осуществляется при помощи анимированных переходов, панорамирования и масштабирования, ориентируя пользователя в пределах большей формы. Это дает человеку познание, где его отправная точка, и куда он направляется.
В случае если проектируется интерфейс, управляемый жестами, при помощи этих приемов кроме этого возможно предложить сотрудничество, нужное для возвращения к исходной точке.
Гугл Maps
Гугл MapsStreet View — еще один функции и объединения удачный пример формы. Интерфейс приложения принимает форму исследуемого города. Нажимая на здания и дороги, пользователь перемещается в пространстве, а масштабирование и анимация оказывают помощь ориентироваться в более больших формах.
В следствии приложение фактически не имеет элементов навигации — сам контент и есть интерфейсом.
Наконец, гладко интегрированы функция и форма в Clear, приложении-планировщике задач для iPhone. «Слоистая» форма интерфейса приложения позволяет без проблем ориентироваться в его содержании. анимация и Цвет употребляются для обозначения перехода от одного слоя информации к второму. Помимо этого, это еще один красивый пример, как метод перехода, интеграция контента, его формы и UI смогут быть применены для более естественного сотрудничества с приложением.
Clear: «слоистый» интерфейс
- Умный термостат Nest: анализ эмоционального дизайна
Части и целое
Фрэнк Ллойд Райт полагал, что все части (включая помещения, пространства в и снаружи помещений и внешнюю среду) взаимосвязаны с целым. Он считал, что должен быть альянс между конструкцией, ее расположением, материалами, контекстом и временем, и сказал, что визитёры должны восхититься всем строением («целым»), прежде, чем войдут в его помещения («части»). В следствии подъезды, в большинстве случаев, были скрыты либо замаскированы.
По словам Райта, «Приближаясь к строению, необходимо обойти его полностью, перед тем как достигнуть входа».
К тому времени, как визитёры приближались ко входу, у них оказалось лучшее представление о строении. Это одинаково относилось и к частным зданиям, и к громадным проектам. К примеру, сотрудники Johnson Wax должны были сперва объехать около строения, а после этого через гараж, для получения доступа к главному входу:
Гараж штаб-квартиры Johnson Wax
От взора на целое — к пониманию частного
Сейчас мы используем группировочные диаграммы (affinity diagram) и карты сайтов (site maps), дабы визуально организовать данные. Эти инструменты кроме этого разрешают собирать и разглядывать связи между частями информации; их возможно применять, придавая информации форму.
Было бы хорошо, так же как Райт, дать пользователям возможность заметить всю форму («целое»), перед тем как вводить в контент («часть»). Данный начальный, целостный взор может дать дополнительный контекст и разрешить лучше осознать связь разной информации:
Связь его синонимов и слова на сайте Visual Thesaurus
«Визуальный тезарус» выстраивает связанные синонимы в кластерах около слова, находящегося в фокусе. Как и в группировочной диаграмме, это снабжает открытое видение целой формы. Цветовое кодирование говорит о различии между частями речи — существительными, прилагательными и глаголами.
Синонимы являются вершинами графа визуальной сети («целого»), что оказывает помощь осознать, как они связаны между собой и заданным термином в центре.
В следствии, у зрителя имеется более возможность принятия и глубокое понимание информации ответа (в этом случае, выбор более подходящего синонима). Так же, как строения Райта, данный инструмент разрешает изучить всю сеть синонимов прежде, чем углубиться в ее содержание. Помимо этого, Visual Thesaurus применяет идеи Райта о функции и форме: сеть синонимов соединяет в себе пользовательский интерфейс и контент.
Если вы следуете правилу о функции и форме, то некое время, затрачиваемое пользователями на восприятие всех данных в целом перед погружением в конкретные подробности, не повредит. В зависимости от того, на что направлен дизайн, возможно разглядывать визуализацию связи между частями информации и ее неспециализированным понятием как помощь пользователю в освоении контента.
- применение принципов и Визуальное восприятие гештальта в веб-дизайне
Гармония между его окружением и зданием
Фрэнк Ллойд Райт известен еще одним своим высказыванием: «Ни один дом не должен быть ни на бугре, ни на чем-либо еще. Он должен быть частью бугра. Принадлежать ему.
дом и Холм должны жить совместно, любой для счастья другого».
Райт шепетильно проектировал строения, каковые становились продолжением окружавшей их среды. Он использовал данный философский подход ко всем своим работам. «Дом над водопадом» (Fallingwater) — хрестоматийный пример взоров Райта. Карнизы кровли параллельны участку гора, на которой, под строением, начинается водопад:
«Дом над водопадом»
Райт обожал смешивать открытые и закрытые пространства. Легкие перегородки, либо стеклянные стенки, окутывающие жилое пространство «Дома над водопадом», привносят вовнутрь него часть внешней среды. Выступающие свесы и затененные карнизы вытягивают интерьер во внешнее пространство. Низкий профиль строения дает чувство, что оно прочно стоит на земле.
Долгие, низкие линии крыши напоминают линию горизонта.
Устройство — это площадь застройки для разработчика
Шепетильно изучите устройства, для которых вы проектируете. В дополнение к предлагаемому максимуму разработок, стоит кроме этого разглядеть их физическую структуру, ощущения и внешний вид при применении. Воображайте устройство в качестве надела земли, на котором находится приложение. Следуя этому принципу, сделайте так, дабы они трудились совместно в полной гармонии.
приложение и Устройство должны «жить совместно, любой для счастья другого».
На функциональном уровне данный принцип (к примеру, способ и форма устройства его размещения в руках) может значительно повлиять на модель сотрудничества. В частности, элементы навигации телефона возможно разместить в пределах досягаемости громадного пальца. Внимание к устройству может кроме этого оказать влияние на каждые принимаемые эстетические ответы.
приложение и Устройство должны «жить совместно, любой для счастья другого».
Твитнуть цитату
Пара лет назад, в то время, когда скевоморфный дизайн являлся популярной тенденцией, было очевиден конфликт между ровным, футуристическим дизайном iPhone и ретро-дизайном экранного интерфейса, как будто бы сшитым из кожи.
И еще раз, «Nest» воображает хороший пример дизайна, что трудится в идеальной гармонии с физическим устройством. Ничего ужасного в том, что одна компания создала как программное, так и аппаратное обеспечение. Поразмыслите о тех устройствах, на каковые станете ориентироваться в вашем следующем проекте.
Заключение
Райт и Фрэнк был подлинным пионером, авангардным архитектором, чьи совершенства легли в базу архитектурных шедевров, не потерявших актуальности практически столетие спустя. Как дизайнеры, вы имеете возможность получить воодушевление в философии его архитектуры. Как и в его строениях, любая подробность ваших разработок обязана помогать цели.
Нужно распознать природу применяемых технологий и материалов и узнать, как максимизировать их естественные возможности для исполнения задач.
Если вы разделяете взоры Райта на функции и форму, то возможно упростить модель сотрудничества с устройством методом объединения контента, интерфейса и формы. направляться кроме этого учесть, как любая часть дизайна взаимодействует с целым.
Наконец, вы имели возможность бы учесть приемы создания гармонии между digital-физическим устройством и дизайном. В дополнение к основным правилам дизайна, применяемым ежедневно, эти совершенства смогут продвинуть вашу работу в новых, захватывающих направлениях.
Высоких вам конверсий!
По данным: smashingmagazine.com
Случайные статьи:
- Мега-гид по техникам убеждения для saas-сайтов. часть 2. страница с ценами
- Все, что вам нужно знать о психологии призыва к действию на лендинг пейдж
Усония — идеальный дом Фрэнка Ллойда Райта
Подборка похожих статей:
-
4 Метода увеличения конверсии, которые хорошо работают на мобильных лендингах
Каждая сфера бизнеса страдает от низкой мобильной конверсии. Обладатели сайтов упускают трафик, а показатели эффективности с каждым днем ухудшаются,…
-
Практические методы дизайна анимации
Анимация должна иметь качественный дизайн. Как веб-разработчики, мы думаем об эффекте типографики, макета, сотрудничества, но при добавлении анимации мы…
-
«Гуманизация» как новый метод оптимизации: кейс от positionly
Ежедневно визитёры заходят на ваш лендинг/сайт. Одни из них попадают на него случайно, другие — в отыскивании товара либо услуги, схожих с вашим оффером,…
-
13 Суперэффективных методов поведенческой сегментации
Маркетологи, занимающиеся таргетингом, основанном на поведении и предпочтениях потребителей, преобразовываются в собственного рода психологов. Дать людям…