Данная статья поможет улучшить взаимодействие между дизайнерами и верстальщиками для минимизации ошибок и повышения продуктивности работы.
Работа богата практическими примерами. Она будет полезна специалистам разного профиля.
Дизайн является основой качественной верстки и помогает успешно продолжить создание веб-приложения.
Стандартизированные свойства элементов дизайна (цвета, шрифты, размеры, отступы и т.д.)
В своей практике я часто использую визуально похожие друг на друга компоненты с разной специализацией. Это помогает оптимизировать процесс верстки макетов и доступнее объяснить разработчикам, какие инструменты использовать. Ниже приведен пример с полем для выбора значений. Оно может иметь как один тип, так и множество. Множество помогает лучше передать специфику использования.
Традиционно в IT используются RGB или HSL.
Основная проблема этих цветовых моделей заключается в том, что они нелинейны с точки зрения человеческого восприятия.
Для примера возьмем равномерные ступенчатые градиенты RGB цветов.
#000, #100, #200, #FEE, #FFFи т.д.;#000, #010, #020и т.д.;#000, #001, #002и т.д.;#000, #110, #220и т.д.;#000, #011, #022и т.д.;#000, #101, #202и т.д.
Мы можем увидеть несколько вещей:
Хорошо, RGB — это способ визуализации пикселей, да и разрабатывалась эта модель не для удобного «управления» значениями.
Читать полностью »
Я не буду делать днинное вступление. Один знакомый хакер однажды сказал, что 10 строк кода могут быть понятнее и интереснее, чем 1000 слов объяснений. Все эти примеры написаны на ассемблере для архитектуры Z80 и запускаются на ретро-компьютере ZX Spectrum 48k.
Всем привет. Летом успешно «чипировался» и получил соответствующий qr-код на госуслугах. Собственно ничего интересного из себя он не представляет – рябенький квадратик, который все уже неоднократно видели. Разве что можно потренироваться читать его без компьютера - но я в этом участвовать не собираюсь. Будем извращаться по-своему.
Именно его безликость и подтолкнула к желанию превратить сей виртуальный предмет в некое произведение искусства, доступное при севшем телефоне и при этом имеющее практическое применение.
По работе мне часто приходится рисовать разные схемы, диаграммы процессов и графики, в том числе и те, которые потом используются в качестве иллюстраций для сайта, статей и презентаций. Диаграммы я привык рисовать в app.diagrams.net (бывший draw.io), а графики — в datawrapper.de. Всё бы ничего, но есть у диаграмм, сделанных в draw.io, lucidcharts или visio и графиков, построенных в аналитических сервисах одна беда — они выглядят как-то слишком уныло и «олдскульно», в духе «90-х».
Если хочешь сделать что-то хорошо, сделай это сам
Фердинанд Порше.
Это статья о моём личном кинофильме, с подробными пояснениями, куда мне пришлось прийти по независящим от меня причинам, с техническими подробностями из мира неадекватной 3D-графики, и планами на будущее. Пожалуй, я начну.
Ниже возможен NSFW-текст(но я обойдусь без графики).
Это история о том, как я разочаровался в компании «Паратайп» и шрифтах, которые она производит.
Я делал PDF-презентацию, чтобы показать европейским иностранцам. И что-то меня пробило на гиперкачественную вёрстку с образцовым типографингом. Пускай, думаю, у иностранцев сорвёт шаблон: они-то привыкли, что все русские верстают по-колхозному, особенно если думают, что нет.
Пока я размечал сетку страницы, меня упорола ещё одна идея: использовать шрифт отечественного производства. Пусть европейцы дважды офигеют.
Интернет проник во все аспекты нашей жизни, но мы уверены, что один аспект цифрового мира вы считаете чем-то само собой разумеющимся. Замечали ли вы, что множество ссылок, в частности, гипессылок, имеет синий цвет? Когда коллега спросил меня, почему ссылки синие, я была поражена. Я UX-дизайнер и создаю веб-сайты с 2001 года, и я всегда делала ссылки синими. Да, я отстаивала выбор конкретного оттенка синего и согласованное применение синего цвета, но никогда не задумывалась: почему же ссылки синие? Это просто был факт из жизни. Трава зелёная, гиперссылки синие. В нашей культуре настолько принято ассоциировать ссылки с синим цветом, что когда в 2016 году Google изменила цвет ссылок на чёрный, это вызвало разногласия.
Но теперь меня поглотил вопрос: ПОЧЕМУ же ссылки синие? КТО решил сделать их синими? КОГДА было принято это решение и КАК это решение оказалось таким влиятельным?
Читать полностью »