Как стать автором
Обновить

Комментарии 73

Впервые вижу плоские тени в веб-дизайне. Тренд ли?
На западе — да. Ссылки на западных дизайнеров и разработчиков говорят об этом.
НЛО прилетело и опубликовало эту надпись здесь
НЛО прилетело и опубликовало эту надпись здесь
Будем надеяться что это отомрет или эволюционирует быстрее чем «мокрый пол».
Изображения качуют из поста в пост. je.roon.io/long-shadow-design (этот однако самый свежий)
Ага. Два изображения, и еще два. И текст. Может быть все же поставите плашку «перевод»? Или в шапке напишите, как-то честнее будет.

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

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

Как можно сейчас заметить, многие дизайнеры начали использовать эту идею, от чего, как мне кажется, теряется индивидуальность и происходит банальное клонирование. Единственное отличие при проектировании такой “тени”, это угол проецирования(45° или 120° градусов) и направление.
Но, длинные тени ограничены областью применения, это всегда небольшие элементы дизайна(кнопки, логотипы, иконки).


Оригинал:

“Long shadow” is not a new term. It is actually borrowed from lighting and photography. Photographers often show long shadows in images to create a high-drama effect. In natural light, long shadows are cast when the sun ins near the horizon, occurring both at dusk and dawn.

In design, long shadows have become a quick trend. In design, long shadows are being added to objects in flat design schemes. The shadows, which often rest at a 45-degree angle, mirror an object and add a lot of emphasis and drama.
What’s different about these shadows are that, they too, are flat. Designers are creating long shadows using a tint of the color with no fading, shading or graduation of color.

It seems like many designers hopped on long shadows almost all at once and are using the same basic idea. Even as far as the direction and angle of each shadow. (Most shadows fall to the lower right corner of the object at a 45-degree angle, although some designers are using 120 degrees.) Shadow edges are sharp and add an extra element of depth to the overall design.


designmodo.com/long-shadows-design/
Это же восход!
Это и закат, и восход, а значит не восход и не закат.
В северном полушарии это закат. На уроках географии нас учили стороны света определять, ориентируясь на север. Впрочем цвета восходные вполне.
Все это было до iOS7. В мобильном дизайне плоский интерфейс пришел с Holo и WP.
Да было, выход iOS 7 закрыл эру сквеморфизма, так что даже дизайнерам рисующим под iOS пришлось переходить на flat.
Новый подход при проектировании чего? если иконок, то я понимаю как оно будет жить. Но сам интерфейс с такими тенями мне пока плохо представляется.
Возможно, я скорее всего, задал бы вопрос о функциональности. Мне кажется это мода, мода, которая проходит.
С моей точки зрения в плане функциональности они ничем не отличаются от обычных (стандартных) иконок.
Уверен не тебе одному :-) В некоторых вариациях в приведенных иллюстрациях смотрится на мой взгляд интересно «тренд». Но вот когда «тренд» начинают натягивать применять на все что «движется»…
Только заметил. Почему на иконке Сафари две разных тени?
image
Почему у стрелки тень другая?
Другая тень? Может потому что они складываются?
Рассеянное освещение
А еще не стрелки, но пометкки СВ и ЮЗ не имеют тени, только периметр компаса.
Тут вообще черти что. Тень должна быть и внутри корпуса (циферблата?). Если предположить, что он выпуклый (т. е. голубая поверхность внутри находится выше, то не должно быть тени на его окантовке.
Этот компас вообще рисовал кто-то, кто о тени имеет только отдаленное понимание. Такая тень может быть, только если стрелка высотой огого, тоесть или это какой-то неправильный компас, или дизайнер с головой не дружит (хотя судя по всяким концептам, рисованым дизайнерами — второе)
Просто тень от стрелки должна быть оторвана от неё, т.к. стрелка висит над поверхностью. Тут же типичное применение принципа без понимания сути.
Меня каждый раз в таких ситуациях интересует вопрос — «Почему люди часто соотносят реализацию дизайнерской идеи с неким физически реализуемым объектом?»
Просто красиво запилил… и пофиг, что выглядит нереально.
Да, юзерам пофиг, что выглядит не очень реально.
Обычно на это обращают внимание начинающие или непрофессиональные дизайнеры — они уже понимают, как строятся тени, но не понимают суть условности изображения.
Ну, кстати, это свойственно не только начинающим. Читал я стайл-гайд от Apple, кажется, про «физическую визуализацию» кнопок. Про однопиксельные оконтовки кнопок, имитирующие реальные металлические кнопки достаточно подробно описано. Вот такие гайды и задра.. затачивают мозг на конкретную линию мышления, часто довольно агрессивную.
Я за чесность — цифровой контент, как минимум, имеет право выглядеть по-цифровому.
> набирающий огромную популярность подход при проектировании

При чем тут проектирование?
А что, по вашему, иконка — это иллюстрация? Лично для меня, все элементы, с которыми взаимодействует пользователь должны иметь иной подход, который и называется проектированием. Давайте так, что для вас термин «проектирование?»
Иконка — декорирование, а не проектирование. Проектирование — создание проекта. На выходе — проектная документация, прототипы. Иконка — не проектная документация и не прототип, а элемент оформления.
Я думаю, что Strizhevich хотел донести мысль, что эти оригинального стиля иконки за собой тянут много изменений как в визуальном, так и концептуальном построении интерфейса. Стилистические решения в графике могут повлиять опосредовано и на вес UX продукта. Потому могут отчасти измениться и принципы проектирования GUI. Хотя связь и весьма нечеткая.
И почему нет теней от других элементов?
Учитывайте высоту. Из-за малой высоты роза ветров не отбрасывает тень, т.к. свет падает под углом.
Отбрасывает, но не лучами почему-то. Посмотрите на вторую тень внутри тени от стрелки компаса.
Ну да, дизайнер намудрил
Просто он никогда не видел компаса
Просто он никогда не выходит из офиса и не видел ни разу тени в реале.
Потому, что это — работа профессионального дизайнера. Он убрал все лишние элементы, замусоривающие пиктограмму при рендере в малом размере.
почему тогда он (или его коллега) добавил тень у твиттера в малом размере?
image
Та, что слева — не мешает. Справа тени от клюва, как видите, нет.
Это делается на глаз по собственному вкусу, пренебрегая правилами начертательной геометрии. В пиктограмме «in» другой дизайнер мог бы оставить тень от точки.
Это похоже на закат веб-дизайна.
Подпишусь. Отвратительно.
Очередное поветрие. Рано или поздно пройдёт и уступит место чему-то ещё.
Вот еще несколько таких умных постов и все будут точно знать, что Flat интерфейс зародился из iOS 7. Кстати слово Flat хорошая замена слову Metro.
*Flatro
+1
Есть такой Flatro Icon Pack.
Плоский дизайн пришел с Метро, и уже около двух лет назад, никак не за несколько недель до выхода iOS7
Согласен. Но речь в посте о плоском дизайне с использованием длинных теней.
НЛО прилетело и опубликовало эту надпись здесь
мне как юзеру плоский дизайн не нравится.
Но как разработчику — очень! Плоский дизайн имхо в 10 раз проще делать, чем тот дизайн, что принят в ios6.

Это приведет к тому, что цены на дизайн иконок и интерфейсов для iOS7 станут в разы дешевле.
Вот, кстати, интересное замечание.
Возможно яблочники провели редизайн среди прочего и для того, чтобы разработка приложений под их платформу стала дешевле?
Потому как сейчас цены на качественные приложения находятся где-то в стратосфере. Одна только заглавная иконка стоит 1-2к зелени.
Плоский дизайн — вполне себе ничего, но вот длинные тени — это какое-то убожество. Такое ощущение, что кто-то пытается сделать плоский дизайн объемным… только вот зачем?
Иногда это может быть приятным решением, но на мой взгляд только для каких-то статичных картинок. Плоское приложение и например такая тень где-то на сплеш скрине.
Длинные тени в минимализме. Простите нафига?
Та какой тренд еще, на дрибле пацанов проперло просто порисовать.
Спасибо. Взял на заметку.
Как бы не проталкивался минимализм и плоскота, а люди все равно тянутся к объему. Прикольно.
хм… а по мне как-то убого смотрится…
Статья о тени под иконками.
«Эволюция», «веха»…
куда катится мир
НЛО прилетело и опубликовало эту надпись здесь
А мне нравится :)
Не, ну разумеется, это не прорыв в дизайне, но как дополнительный художественный прием — почему бы и нет?
Кстати, очень забавно узнать, что это тренд, еще до того как эта идея вышла за пределы контекста подобных публикаций %)
Покамест это «тренд в головах дизайнеров», я бы сказал.
Куда-то не туда пошел современный дизайн. Ибо, как только появилась достаточно большое число устройств с экранами высокого разрешения, на которых хорошо смотрятся иконки с множеством деталей, так сразу множество деталей стало не модно. Может просто дизайнеры работать не хотят?
Не волнуйтесь, всё будет. И на таких экранах очень красиво выглядят шрифты
НЛО прилетело и опубликовало эту надпись здесь
На тренд это никак не тянет — слишком простой прием, который быстро себя исчерпает.
Неверный ключ.

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

Есть разнообразные визуальные фигуры, формы, фразы, приемы. Зачем, найдя какой-то один эффектный ход, обзывать его, простите, трендом и пытаться вписать всё вокруг в эти искусственно созданные рамки?

image
НЛО прилетело и опубликовало эту надпись здесь
Подождите… Но плоский дизайн, это скорее ближе к Win 7 mob и Win 8, да там он называется Metro, но я бы скорее их назвал флагманами.
Зарегистрируйтесь на Хабре , чтобы оставить комментарий

Публикации

Истории