Обаяние несовершенства |
- Statistics
- Participants
- Translate into English
- Translation result
- 49% translated in draft.
Все что я знаю об обаянии несовершенства, я узнал, разглядывая белую фарфоровую тарелку, которую купил в Киото.
Что в ней такого особенного? До обжига она была идеально круглой, но художник намеренно повредил края. Она изящна, и ее украшает все, что касается ее поверхности - яркая зеленая груша, грубо поломанный шоколад, горсть жареного миндаля. Сейчас эта тарелка стоит на столе в моем кабинете. Она символизирует важнейшее знание о профессии: полезность не зависит от совершенства формы. В сущности, все, что я узнал о проектировании удачных взаимодействий— от творческого задания до дизайна пользовательского интерфейса — предполагает полный отказ от стремления к совершенству.
В переводной японской литературе рассказывается и пересказывается анекдот о мастере дзен, который остановился у священника в храме неподалеку от Киото. У священника были гости в тот вечер, и почти весь день он провел в саду - поправлял мох, выдергивал сорняки, сгребал листья в аккуратные кучки, - все это для того, чтобы добиться того идеального состояния, которое было изначально задумано строителями храма.
"Разве он не прекрасен?" – спросил священник мастера.
Мастер кивнул в знак согласия. "Да... у вас красивый сад; но кое-чего здесь все-таки не хватает..."
Старик неспеша подошел к дереву, которое росло в середине гармоничной композиции из камня и мха. Была осень, и листья потихоньку засыхали. Мастер слегка потряс дерево, и сад снова был полон хаотично разбросанных листьев.
"Вот чего не хватало", – сказал мастер.
–Janwillem van de Wetering, The Empty Mirror
Ваби-саби и разработка сайтов
Когда я думаю о парадигме достижения изящества через несовершенство, на ум приходит японское понятие ваби-саби.
Леонард Корен в своей книге "Ваби-саби для художников, дизайнеров, поэтов и философов" описывает следующие предметные качества ваби-саби: асимметрия, неровность, простота, умеренность, близость и намек на естественное угасание.
Может показаться, что эти свойства относятся только к эстетике дизайна. Но в большинстве примеров удачного дизайна они учитываются на каждой стадии, от идеи до готового продукта. Как писал Корен,
"Простоту ваби-саби лучше всего описать как состояние изящества, достигаемое трезвым, скромным, искренним разумом. Основная стратегия этого разума — экономия средств. Урежьте все до основания, но не отказывайтесь от поэзии. Пусть все будет чисто, незагроможденно, но не стерильно. (В ваби-саби вещи всегда эмоционально теплые.) Обычно это предполагает использование ограниченной палитры материалов и сведение количества бросающихся в глаза деталей к минимуму. Но это не означает удаление невидимой соединительной ткани, которая связывает элементы в значимое целое".
Непросто привнести сердечность в web experience, ведь сайты и приложения являются, в сущности, конструктами логики (через код). Сделать сайт, который был бы чистым выражением ваби-саби, нельзя, но поиск способов, как обронить намек на ваби-саби, указывает нам новое направление. Приходится думать, как естественный порядок нашего физического мира может наполнить чувством создаваемые нами виртуальные миры информации. Этот природный ход вещей находит выражение в веб-дизайне, например, через понятие изящества.
Таксономия изящества
Джереми Алексис (Институт Дизайна Иллинойского ИнститутаТехнологии) выделяет по отношению к дизайну три типа изящества: логическое, системное и эстетическое.
Логическое изящество берет начало от четко выраженной причины существования веб-сайта. Формулировка прозрачной логичной идеи сайта вносит ясность в комплекс потребностей пользователей и требований бизнеса.
Недавно я видел выступление Люка Вроблевски о бета-редизайне домашней страницы Yahoo. Люк объяснил основную идею: Yahoo станет «пультом управления всем, что вам нравится в сети». Вся команда приняла этот тезис, осознала сложность дизайнерской задачи и спроектировала для пользователей более содержательный experience.
Systemic elegance arises from the scaffolding that supports a site’s core idea. In a website or web application, this scaffolding includes information architecture, user experience, and interaction design as well as content strategy and the flow of information through the system.
Netflix provides an excellent example of both logical and systemic elegance. The company’s undiluted focus on providing affordable access to movies, combined with an ever-evolving user experience rooted in an elegant site architecture, allows visitors to easily use social networking features and view movies online—while, simultaneously, their choices enhance the site’s referral engine.
Формальное, или эстетическое изящество подразумевает визуальную форму веб-сайта. Это включает в себя дизайн пользовательского интерфейса и качества бренда, которые определяют визуальный язык сайта, контент и взаимодействие с пользователем.
Любой дизайн, который фокусируется на чистоте, может считаться формально изящным - даже если сам сайт дурацкий, как например National Geographic Kids. Более очевидный пример — сайт Luigi Bormoli, который использует AJAX для изящного показа стеклянной посуды. Как и обычный печатный каталог, этот сайт способствует тому, чтобы пользователи рассматривали и исследовали продукты, без ненужных обновлений страницы. Если убрать эстетические элементы, основанные на AJAX, сайт уже не будет так изящен.
I’d like to add one more variety of elegance to Alexis’ list. Natural elegance deals with the “feel” a website or application expresses through its behavior over time, and which is rooted in the rules of order that govern nature.
I’m not just talking about grid systems and earthy screen designs. Natural elegance refers to the ways websites and applications can function more powerfully by weaving natural imperfection into their design at every level. This sensitivity to feel should suffuse the whole endeavor, from the foundational user experience work to the final UI.
It’s possible to create perfectly pleasing websites by focusing only on formal, structural, and logical elegance. But those sites that embrace this fourth type of elegance feel to users like living beings who speak meaningful words; they are the marriage of form, function, pleasing content, and personal feeling.
Where wabi-sabi meets user interface design
Recall the attributes of wabi-sabi: asymmetry, asperity, simplicity, modesty, intimacy, and the suggestion of a natural process. You can probably imagine where these characteristics can be expressed through the visual design of your website. Consider the following possibilities:
WEBSITE AS BOOK—THE PAGE MODEL:
Visual exceptions create variety, forcing the eye to focus on priority content (asymmetry),
Enlivened by surface texture to create an illusion of dimensionality, (asperity),
Design tension born of a grid system on a 2D plane (simplicity) or an organic arrangement that can’t be readily made into a system (suggestion of a natural process),
Typography is styled in a controlled manner (modesty), and
The design, from its governing idea through to the finer details, conveys emotion (intimacy).
Craigslist is a prominent, though somewhat rudimentary example of a website that exhibits this design model in a naturally elegant way. While the result may not be visually stunning, the site directly reflects the ways in which we view and share information as a community. Craigslist has evolved in its own organic way over time while staying true to a kind of human expression that mimics a real-world community bulletin board.
The rules change, however, when you’re talking about websites that move beyond the page model to mimic our physical world in its organization and behavior. There is a fine balance between order and chaos when designing the following types of websites:
WEBSITE AS GARDEN—THE PHYSICAL WORLD MODEL:
Design tension born of figure/ground relationships on a 2D plane (asymmetry) with an illusion of a third dimension on a z-axis,
Surface textures are mapped onto objects, simulating reality, and
Visual exceptions, if they don’t conform to the simulation, break the illusion.
The Eco Zoo takes natural elegance and makes it physical. On this site, you can “climb” a tree and read stories in a pop-up book about creatures such as Yagi-Chan, a goat that wears sheep’s clothing.
WEBSITE AS PETRI DISH—THE MOLECULAR MODEL:
Design tension born of the gravitational pull between page elements,
Objects can’t express a high level of detail, otherwise the UI is all noise, and
The site is the visual exception, tending from disorganization (exploratory) to organization (sorted) with a click.
WeFeelFine.org—a site that harvests and visualizes data about human feeling from blogs around the world—demonstrates the ease, flexibility, and fluidity characteristic of natural elegance.
A koan for the web designer
Nothing we see or hear is perfect. But right there in the imperfection is perfect reality.
–Shunryu Suzuki
We’ve explored a number of threads that, when properly woven into a well-thought-out website, can infuse it with heartfelt intelligence beyond mere aesthetics. In small doses, wabi-sabi thinking can provide a counterpoint to our modernist tendency to refine things within an inch of their life, bringing a measure of grace to what would otherwise be a conglomeration of rigidly spaced pixels on a screen.
Beware that the pursuit of website perfection is always a denial of the perfection that exists within ourselves in the physical world. Perceiving even a whisper of our own “perfect reality” is the very experience that our users and clients have hired us to capture, mindfully, through our work.
