Задать вопрос
Дизайнер широкого профиля, по совместительству арт-директор. Фрилансер. 13 лет опыта в дизайне.
Сферы деятельности:
• веб дизайн и разработка
• digital art
• видео и спецэффекты
• мэтт-пейнт
• промышленный дизайн
• рекламная фотография
• айдентика
• арт-директоринг
Контакты
Местоположение
Польша

Достижения

Все достижения (4)

Наибольший вклад в теги

Все теги (34)

Лучшие ответы пользователя

Все ответы (36)
  • В каком разрешении рисовать макет на Retina?

    Aleksei_Segodin
    @Aleksei_Segodin
    арт директор / дизайнер
    Короткий ответ:
    не рисуйте в Фотошопе — рисуйте в Adobe XD. И все вопросы про dpi отпадут сами по себе.

    Более развёрнутый ответ:
    как правильно заметил GreatRash, dpi не имеет значения. Главное — кол-во пикселей. Да и то, с такими динамичными интерфейсами и адаптивными сайтами которые востребованы сегодня даже пиксели "сдают позиции" и делят место с %.

    Если отвечать на вопрос, то верстать нужно в том разрешении (в пикселях), которое показывает браузер. Например, если с обычными компьютерами все ясно: ширина экрана 1280px, значит и рисовать нужно в 1280. То с телефонами уже все не так очевидно. Например, физический размер экрана iPhone 6: 750x1334px. Но браузер на телефоне показывает сайт так как будто бы там вдвое меньше пикселей: 375x667px. То есть, если вы в макете нарисуете блок шириной 187px, то он займёт половину экрана на iPhone 6.
    Есть отличный сайт, который показывает размеры экранов самых популярных мобильных устройств:
    • их фактические размеры (первые две колонки)
    • и размеры, которые "понимает" браузер (3 и 4 колонки — это то, что вам надо).


    Почему Adobe XD? Потому что, зуб даю, через пару лет Adobe скажет:
    — Ребята, мы убираем из Фотошопа все фишки, которые раньше помогали вам делать дизайн сайтов. Верстайте их теперь в XD. А мы оставим фотошоп для фотографов и иллюстраторов.

    Дело в том, что Adobe XD — это их новая разработка для прототипирования (дизайна) сайтов. И разработка этой программы идёт полным ходом. Пока-что доступна только под Мак (к концу года будет Windows версия). В программе есть очень "вкусные" фишки, которые ускоряют работу в десятки раз. Посмотрите хотя бы эту GIF-ку ниже. А ещё сама программа очень быстро работает.

    xd-grid-animation-375x500.gif

    Есть еще Sketch. Он тоже создан специально для дизайна сайтов и только под Мак.
    Сначала может быть трудновато привыкнуть к дизайну без Фотошопа, но оно того стоит, поверьте.

    Философия:
    Что такое дизайн сайта? И зачем думать про разрешение? И зачем вообще мы их рисуем?
    После того как сайт сделан и проект закрыт, все PSD макеты дизайнера отправляются в архив и лежат там мертвым грузом десятки лет пока вы их не удалите. Рисунки никому не нужны — нужен сам сайт. А рисуем мы их для того, чтобы легче представить себе и показать верстальщику как сайт должен смотреться. То есть, если бы мы могли телепатически обьяснить верстальщику что и как должно выглядеть, то никто бы не занимался этой "ерундой" в Фотошопе. И это основная задача дизайнера: придумать как сайт должен выглядеть, анимироваться и взаимодействовать с юзером и передать это дальше в производство.

    И тут ваша идеальная работа, как дизайнера, должна выглядеть так:
    1. Вы рисуете страницу так как она должна выглядеть и выносите в отдельный документ (или слой) все размеры всех блоков, отступов, хедеров, футеров и пр. У вас должно получиться что-то вроде "чертежа" сайта с вашими комментариями;
    2. Затем, в отдельное место выносите дизайны всех кнопок, полей для ввода текста, стили заголовков, аккордеонов, вкладок и всего остального что есть на вашем сайте;
    3. Отдельно подготавливаете контент: текст и картинки. При этом желательно, чтобы картинки были сразу продублированы в нескольких размерах (в случае с адаптивными сайтами).
    4. Все иконки — тоже отдельно. Векторные, в формате SVG, плюс PNG — для подстраховки при вёрстке.

    Затем собираете это все в один портфель и несёте верстальщику. Он скажет вам большое спасибо и назовёт лучшим дизайнером в мире.

    Для примера, касательно пункта 1, посмотрите как я обычно оформляю ТЗ для верстальщика. Это только две страницы из 20-ти.

    01b4d706294b4363a976980638344a8c.png9a0bf90210c4469682e82cc1413c9843.png

    А эта работа, которую вы проделали — это не "дополнительный" труд. Это то как обычно выглядит хороший дизайн-процесс. Особенно, в больших студиях. Таким образом вы избавитесь от кучи мелких ошибок со стороны разработчиков и от необходимости разжёвывать все мелочи отвечая на их "глупые" вопросы.
    Ответ написан
    9 комментариев
  • Возможно ли работать Blender'ом на слабом ПК?

    Aleksei_Segodin
    @Aleksei_Segodin
    арт директор / дизайнер
    Да, в принципе, можно.
    Но на практике это зависит от того с на сколько тяжёлыми сценами (кол-во полигонов) вы будете работать и какое их предназначение. Трудно говорить про какую-то конкретную сферу. Теоретически, можно работать как в сфере архитектурной визуализации так и с киношными спецэффектами. Но тут всё зависит от того, что именно вы будете делать и как. Повторюсь: в принципе это возможно, но всё упирается в сложность сцен с которыми будете работать.

    Если всё-таки привязываться к индустрии, то самыми "безопасными" в случае со слабым ПК будут игровая индустрия и WebGL (3Д сайты в браузерах). Потому что в этих индустриях изначально всё делается с расчётом на оптимизацию. Короче, если 3Д сцену можно посмотреть на телефоне при 60 кадрах/сек, то с ней можно работать и в Блендере даже на слабом ПК.

    Вот пример качественно сделанного 3Д объекта, который можно и в играх использовать, и в браузере: https://threejs.org/examples/?q=gltf#webgl_loader_gltf
    Покрутите сцену и посмотрите счётчик кадров в секунду в левом верхнем углу на вашем ПК.
    Ответ написан
    Комментировать
  • В чём отличие фотобашинга от коллажирования?

    Aleksei_Segodin
    @Aleksei_Segodin
    арт директор / дизайнер
    Коллаж и фотобашинг — это почти синонимы. Коллаж может быть частью фотобашинга, а фотобашинг, может использоваться в процессе коллажирования.
    Но есть нюансы (в зависимости от контекста использования):

    Чаще всего, коллаж (фотоколлаж) — это такая техника иллюстрации когда вы создаёте иллюстрацию с помощью набора фотографий, по всякому их комбинируя. Например так (gif анимация):

    3b25ad4cb35e83686179e0f3ea3ffeee.gif

    А фотобашинг (photobash), часто используется как термин, когда вы хотите текстурировать какой-то объект(ы) с помощью фотографий. При этом, фотобашинг, в профессиональной среде, обычно служит для создания быстрых эскизов, без детальной проработки деталей объекта.
    Вот пример: здесь я сделал иллюстрацию c береговой линией (кстате, коллаж), а затем мне понадобилось сделать быстрый эскиз крепости. Я сделал 3Д модель и отрендерил её без текстур:

    1044381.53ed731e95d5c.jpg

    Затем я нашёл фотку с плюс-минус подходящей текстурой и наложил её поверх своей 3Д модели.

    5672412b603a4bedaa8f4e1e395d4d1f.jpg

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

    1044387.53ed732162aff.jpg

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

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

    Ниже ещё по одному примеру коллажа (1) и фотобашинга (2):

    1. Иллюстрация одного моего знакомого (Алексея Самсонова) с сайта stock.adobe.com:

    5e0b2c9837fb4c1fbab86cc8b49f4204.jpg

    2. А здесь пример более качественного фотобаша. С первого взгляда всё круто. Но если присмотреться, то детали не «цепляются» друг за друга — не видно откуда у той или иной детали «ноги растут».

    soren-zaragoza-photobash.jpg
    Ответ написан
    3 комментария
  • Как в Apple создают такие сочные изображения своей продукции?

    Aleksei_Segodin
    @Aleksei_Segodin
    арт директор / дизайнер
    ad1bd9cd1bb4499ca2d0e70369f8c52a.png

    Такие?

    Там везде, в основном, 3Д графика. Один раз сделали добротную 3Д модель и крутят-вертят её как хотят — показывают с разных ракурсов.

    Лирическое отступление про фотографию:
    Да, фотки они делают, но далеко не всё получится так четко сфотографировать. И вам никаких сверх-мегапиксельных камер и супер-чётких объективов не хватит для того, чтобы сделать изображение пригодным для печати в большом формате.
    Вот тут ребята пытались повторить то о чем вы спрашиваете: https://www.youtube.com/watch?v=YOKwEVrna6s
    Их результат похож на олигинал, но входе видео ведущий сказал, что это была очень долгая и тяжелая фотосессия. А результат всё равно был далёк от цели и они отдали фотку ретушеру на обработку.
    В общем, слишком много геморроя с фотографированием. Слишком много времени и пост-обработки. И это только одни часики. А если их нужно будет сделать с другого ракурса? То это, как минимум, ретушь — по новой.

    3Д:
    Сделав 3Д модель один раз вы можете её "фотографировать" до бесконечности и без всякой пост-обработки. Или с минимальной. А если нужен видео ролик? — Используется та же самая 3Д модель!

    Если хотите уметь так как они, то ищите в направлении 3Д графика. Ключевая фраза: предметная 3Д визуализация. На английском качественнее и больше информации: product 3d visualization.

    Пост-обработка этой иллюстрации в Фотошопе (как и той, что выше) = 0%
    Просто голый 3Д рендер:

    05464cba43314aa0b741780b40befade.png

    Но если не хотите связываться с 3Д графикой, то ваше направление для изучения: технический дизайн, он же техдизайн. Пример: https://www.artlebedev.ru/kovodstvo/business-lynch...
    Ответ написан
    1 комментарий
  • Будет ли страница сайта корректно проиндексирована если установлен редирект при отключенном JavaScript?

    Aleksei_Segodin
    @Aleksei_Segodin
    арт директор / дизайнер
    Вопрос интересный, но на мой взгляд, в 2016-м уже не актуальный. Если только посетители сайта не какие-то очень особенные люди.

    Вопрос не актуален, потому что вероятность того что кто-то зайдёт на сайт с отключённым JS стремится к нулю. И если такие люди есть (которые сами отключают JS), то они относятся к очень специфической аудитории и "потеряв" их как посетителей владелец сайта ничего не потеряет. Если только именно эти специфические люди не являются целевой аудиторией сайта.

    Как решение проблемы (более практическое, а не теоретическое) я бы советовал вам определиться с целевой аудиторией сайта. И тогда уже решить нужен вообще вам этот редирект или нет. И стоит ли на это тратить время.
    Ответ написан
    Комментировать

Лучшие вопросы пользователя

Все вопросы (12)