Ответы пользователя по тегу Иконки
  • Почему некорректно открывается svg в иллюстраторе?

    pozZzitiv
    @pozZzitiv Куратор тега Adobe Illustrator
    Дизайнер и перфекционист
    Не совсем понял в чем проблема. Открыл svg, посмотрел, подвигал закрыл с сохранение, открыл снова — всё также и никаких проблем. Что-то у вас с софтом или, простите, руками))

    Как вариант, можно проверить в Аи настройки привязки объектов к сетке, настройки экспорта, а также попробовать разные варианты эскпорта/сохранения svg. Опишите пошагово действия по экспорту svg, открытию в Аи и пересохранении svg после (куда нажимаете, через какие пункты меню, плагины, скрипты и т.п.). Может где-то в процессе ошибка, попробую повторить.

    PS От себя скажу что перерисовывать иконки в Фш (как это сделали вы, я посмотрел оба psd-файла) это извращение. В Иллюстраторе это сделать гораздо проще и быстрее. Приучите себя работать с иконками сразу в векторном редакторе.
    Ответ написан
  • Какие иконки требуются для дизайна приложения?

    pozZzitiv
    @pozZzitiv
    Дизайнер и перфекционист
    Заказчик просит подготовить иконку приложения. По ссылкам необходимый набор иконок, который он считает достаточным.

    От вас требуется сначала сделать иконку для приложения (лучше сразу в векторе) для одного из основных размеров (например, 120рх), утвердить её, а затем подготовить все необходимые размеры. Сначала проще утвердить на одном, чтобы не переделывать все размеры если клиент захочет что-то подправить.

    Некоторые делают под самый большой размер и потом просто масштабируют — это самый простой, но не самый правильный способ. Если будет каша после банального ресайза, то это плохо. Правильнее адаптировать иконку под каждый размер — если детали размываются, то их надо либо прорисовать, либо удалить, если становится плохо видно суть изображения, то исправить и т.п. Всё это на совести дизайнера. Забить или нет — решать ему =)

    Подробнее про требования и принципы построения иконок можно прочитать в официальных гайдах платформ (если вы их еще не смотрели при создании интерфейса, то обязательно изучите):
    https://developer.apple.com/ios/human-interface-gu...
    https://developer.apple.com/ios/human-interface-gu...
    https://material.google.com/style/icons.html
    https://developer.android.com/guide/practices/ui_g...

    В сети также есть множество шаблонов для изготовления иконок, можно и их ковырять.
    Ответ написан
  • Можно где-то найти подобные иконки?

    pozZzitiv
    @pozZzitiv Куратор тега Дизайн
    Дизайнер и перфекционист
    Самые обычные реалистичные (а пофакту «оттехдизайненные», если можно так выразиться) бывшие популярными с появлением скевоморфизма Эппл и до повального увлечения плоским.
    https://www.shutterstock.com/search?search_source=...
    Ответ написан
    Комментировать
  • Почему генератор иконок fontello уменьшает толщину линий иконок?

    pozZzitiv
    @pozZzitiv Куратор тега Adobe Illustrator
    Дизайнер и перфекционист
    Потому что в примере огромная иконка и малюсенькая. Уменьшите что угодно, любое растровое или векторное изображение, и всегда в уменьшенном и линии и остальное будет меньше. Это как бы очевидные вещи. Если бы у мелкой иконки была такая же толщина линий как у верхней, то она выглядела бы как черное пятно. но это все теория.
    На практике кликаем на Help/Wiki далее пункт "How to use custom images" и вот здесь https://github.com/fontello/fontello/wiki/How-to-u... читаем о требованиях к загружаемым файлам, там всё чётко написано — без обводок, только один слитый воедино черный объект. Вот и ответ.

    PS Хотите идеально одинаковой толщины линий во всех размерах? Создавайте отдельные иконки и адаптируйте их под разные размеры. Я всегда так говорю клиентам, на что мне всегда говорят «но вектор же можно масштабировать», а потом получают такой же результат и удивляются :D

    PPS А вообще, чтобы мелкая иконка была более читаемой надо в крупной это учитывать. Сейчас вы нарисовали (или не вы, а кто-то другой) иконку, которая хорошо (а на самом деле нет) выглядит на пол экрана совершенно не учитывая мелкие размеры. Если не получается рисовать большую с учетом меньших размеров, то попробуйте сделать сначала мелкую, а потом её увеличить и посмотреть на результат. Потом берёте среднее значение и делаете финальный результат. Моя основная специализация это иконки, поверьте моему опыту)
    Ответ написан
    5 комментариев
  • Какн азывается иконочный сэт?

    pozZzitiv
    @pozZzitiv Куратор тега Дизайн
    Дизайнер и перфекционист
    Судя по разному исполнению иконок, это не сэт, а ассорти из разных. Говорю как дизайнер, сделавший очень много наборов иконок в самых разных стилистиках.
    Ответ написан
    1 комментарий
  • Если мы создадим такие же иконки или очень похожие на те что взяли на Flaticon.com, будут ли они считаться оригинальными?

    pozZzitiv
    @pozZzitiv Куратор тега Дизайн
    Дизайнер и перфекционист
    Начнём с того, что нет смысла перерисовывать что-то лишь для того, чтобы исходник был не скачан, а создан своими силами)) Можно же просто создать набор иконок, добавив в него что-то своё. Какие-то нюансы, которые сделают иконки особенными, именно вашего проекта. начиная от цветовой гаммы и заканчивая рифмой с логотипом и его характерными элементами. Во всяком случае, я всегда стараюсь делать наборы иконок такими)

    Насчёт покупки. Если используете 200 иконок, то дешевле купить подписку т.к. перерисовка обойдется дороже (а сам проект может вообще закрыться за пару лет и вложения будут зря). А вот если иконок всего 10, то нарисуйте просто свои оригинальные, делов-то.

    А теперь про права и лицензии. Если скопируете и владельцы захотят докопаться (зная, что права нарушены), то докопаются и легко засудят. Причём вероятность того, что сходство и нарушение будет доказано зависит напрямую от авторитета и способности убеждать поисковые системы, хостинг-провайдера или судью (если и правду дойдёт до встречи в суде, что в интернете маловероятно). Но будет ли вообще что-то или нет — уже дело случая)) Я конкретных примеров не знаю, но некоторые площадки активно борются с плагиатом и пиратством (Envato, например), защищая своих пользователей.

    Nekto_Habr это для крупной студии копейки) А для одного проекта по 180 баксов в год (по обычной цене, не промо) может быть и накладно ради десятка иконок.
    Ответ написан
    8 комментариев
  • Должны ли иконки социальных сетей подсвечиваться?

    pozZzitiv
    @pozZzitiv
    Дизайнер и перфекционист
    Любые интерактивные элементы следует выделять каким-либо образом. Они должны отличаться от других объектов. Каким — это уже выбирает дизайнер и/или проектировщик интерфейса в зависимости от ситуации. Это является, если не правилом, то просто хорошим тоном в создании удобных для пользователя интерфейсов.

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

    Если вы занимаетесь тестированием, то следует набраться знаний в области проектирования интерфейсов и юзабилити иначе эффективность вашего тестирования будет, так сказать, невысокая))
    Ответ написан
    1 комментарий
  • Svg hexagon Где можно найти такие картинки?

    pozZzitiv
    @pozZzitiv
    Дизайнер и перфекционист
    «Такие» это какие? Просто шестиугольники со скруглёнными углами в формате SVG?
    Для меня такие проще сделать за пару минут в Иллюстраторе, искать дольше. Но и в поиске тоже много находится сразу с примерами кода раз, два и т.п.
    Самих форм шестиугольников огромное количество в интернете, на стоках и т.п. Выбирайте любой.

    Если речь об иконках внутри, то один из вариантов где искать уже озвучили.
    Ответ написан
    Комментировать
  • Что за артефакт в illustrator?

    pozZzitiv
    @pozZzitiv Куратор тега Adobe Illustrator
    Дизайнер и перфекционист
    Все верно, вы задали обводку с такими настройками.
    Чтобы попробовать другие варианты смотрите в панели Stroke (File / Window / Stroke)
    bd939896840e4ca0be4a48918d4999e3.png
    Сейчас у вас параметры Cap, Corner и Align stroke также как на скриншоте.
    Cap отвечает за вид обводки на концах кривой, Corner отвечает за вид обводки в углах, а Align stroke отвечает за положение обводки (по центру кривой, с внутренней стороны контура или с внешней).
    Ответ написан
    2 комментария