Програмування для UI дизайнера?

Всім привіт!
Маю питання до Front-end розробників, а також iOS/Android девелоперів.
Я працюю UI дизайнером на одному з американських стартапів.
За останній час була проведена колосальна робота по UX і візуалу. І, здавалось, круто! — є хороший UI. Але вузьким горлишком часто стають верстальщики, результат роботи яких іноді суттєво відрізняється від затвердженого дизайну.

тому виникло питання:
наскільки затратно по часу освоєння верстки в Avocode чи подібному софті? (цікавить ВИКЛЮЧНО візуальна частина, без логіки і тд). Базові поняття верстки у мене є, оскільки колись пробував себе у цій сфері.

також цікавить чи можливо працювати за подібним сценарієм з мобільними платформами? Тобто освоїти тільки UI частину, щоб верстати pixel perfect інтерфейси. а рештою нехай займаються знаючі люди:)

Скажу наперед, я не маю наміру стати топ-верстальщиком за 2 тижні. І ні в якому разі не хочу принизити чиюсь значимість! :)

Просто хочу щоб мій дизайн виглядав так, як я його задумав. І якщо шишки летять на мене як на дизайнера у будь-якому випадку, то хай я буду винен у всьому :)
Так чи інакше — це досвід, який допоможе мені краще зрозуміти специфіку роботи інженерів і відповідно готувати матеріали для верстки.

Буду вдячний за поради!

Теми: дизайн

Ctrl + Enter

Symonenko Volodymyr software engineer 27.02.2019 14:56

Насколько мне известно в авокод не верстают. Для верстания нужен текстовый редактор с возможностью накатки плагинов типо еммет...
Пиксель перфект это не сложно, но смысла в нем мало. Гораздо лучше делать адаптивный дизайн с учетом сеток, лейоутов... уже готовых в юай фреймворках и с использованием гайдов, например материал дизайн. Так можно быстро родить качественное кроссбраузерное решение.
Вам бы предложил дальше развиваться в дизайне и подумать над собственным гайдом к каждому дизайну. Что имею ввиду. Гораздо дешевле и проще сделать примечание типо: во всех списках свойство overflow: visible, а не отвечать на сто одинаковых вопросов по каждому диву: тут скролл? а вот тут скролл, а вот этот вот список тоже со скооллом?
Еще одна вещь не в пользу вашей идеи. Сейчас большинство сайтов это апликейшн в котором используются фрейморки с компонентным подходом, бывает довольно таки часто что компонент выделяется по функциональному признаку и тогда ваше полотно хтмл проще выкинуть чем разделить на компоненты. Да и зачем это полотно хтмл нужно когда есть куча юай фреймворков!?

Відповісти

Підтримати

anonymous 26.02.2019 17:39

Gennady Dogaev full-stack web developer (freelance) 26.02.2019 15:22

Про pixel perfect тут уже написали. Это во-первых очень дорого в реализации, во вторых в 2019 году верстка должна быть responsive, а не pixel perfect, потому что экраны у всех очень разные. И дизайн должен быть к этому готов, а не рассчитывать что будет только один размер экрана, на котором классно смотрится макет.

Далее, возможно стоит скооперироваться со старшим верстальщиком (синьор/тимлид фронтенд или как у вас на фирме его зовут), создать свой UI-фреймворк (на основе того же foundation) и придерживаться по максимуму его. Он должен предусматривать анимации, изменение цевта/стиля и т.д. Чтобы видя в макете например dropdown — верстальщик знал что нужно использовать готовый компонент. Правда это будет затратно по времени. Но имхо, в разы эффективнее чем дизайнеру пытаться учить верстку и потом все равно доказывать что нарисованое возможно сверстать (допустим вы будете видеть оригинальное решение, а верстальщик нет или наоборот вы не учтете всех ньюансов).

Viktoriya Brovko 25.02.2019 20:34

Тут либо дизайнер не знает что чегото нельзя реализовать, либо верстальщик ленивый или не все умеющий. Я бы разбиралась почему не сделали, то что было отдано в работу, выяснила причину и если это мой косяк переделалабы и больше такого бы не допускмла от себя. Если верстальщик виноват, то пусть с него и спрашивают.

Artem Perchyk Front-end developer 25.02.2019 15:50

Мне кажется, тут проблема не с верстальщиками, а с процессами.
Реализацию дизайнов должны проверять и желательно до мержа фичи. То есть или тестировщик проходит по готовой верстке, сравнивая с дизайнами, или даже дизайнер, если есть время, может этим заниматься отдельно, оставив тестировщику проверку функционала. Четкое соответствие дизайну должно быть в DoD.
Делать работу верстальщиков за них, не имея достаточных навыков (по сравнению с ними), идея так себе.
А pixel-perfect — то ещё зло, честно говоря. Куча статей есть на эту тему.

Програмування для UI дизайнера?

5 коментарів

Підписатись на коментарі

Новини