2 заметки с тегом

инструменты

Кодельновский стандарт именования файлов

Это такая специальная заметка, в которой я рассказываю о том, как назвать файл так, чтобы я не злился и чтобы на него потом было удобно ссылаться. Это справедливо для джипегов, которые утверждаются у арт-директора и показываются клиенту. Скетч-файлы называются просто project.sketch, а всё разделение на страницы и версии — внутри файла (есть исключения, но они пока не важны).

Смотрите, тут всё просто:

Дата. День и месяц показа. Если это будет день создания файла — всё нафиг запутается.

Проект. Общепринятое название проекта — как чат к Слэке.

Часть. Страница или важное состояние. Важное состояние — это, например, попап, который блокирует экран. А открытый дропдаун — неважное, такое мы маркируем модификатором.

Модификатор. Все части названия отделяются дефисом, а модификатор (по аналогии с БЭМом) — двумя подчёркиваниями. Используется, чтобы показать состояние или, что бывает чаще, вариант существующей страницы.

Номер подхода к снаряду. Не всё получается сдать сразу: 2503-kadet-main.png, 2503-kadet-main-2.png, 2503-kadet-main-3.png.

Закрепим:
— Вот поиск: 1801-bilux-search.png
— Ага. А выдачу без результатов дорисуй?
1801-bilux-search__empty.png
— Пасиб

— Вик, цитаты вместе со всем остальным покажешь?
— На: 2102-nen-article-4.png
— <3

Ещё рекомендую пользоваться правильным способом показывать картинки.

2017   дизайн   инструменты   кодельная   команда   принцип   работа   совет

Прогрессбар в макете

Придумывать себе инструменты — кайф и развлечение для мозга. Вот, скажем, есть у нас длиннющий макет с кучей разных этажей. Свежий сайт Кодельной — хороший пример.

Для разработчика — маленький ад. Сущностей много, легко запутаться, что-то потерять, о чем-то подумать, что сделал, а на самом деле не сделать, забыть поменять картинки или текст.

Когда начинал верстать, нарисовал себе рядом с макетом упрощённую схему:

Она помогла запомнить макет, уже неплохо.

Добавим информативности:

Светлозелёные куски теперь показывают на этажи, которые я уже сверстал. Если этаж повторяется — закрашиваются все дубликаты. А тёмные прямоугольники показывают на этажи, в которые я успел написать настоящий текст и положить правильные картикни — они готовы к выпуску. Двойной индикатор прогресса такой.

Пользуйтесь на здоровье.

2016   вёрстка   дизайн   инструменты   информация   опыт   работа