Часто, при поиске вдохновения для создания дашборда на Dribble, я сталкиваюсь с прекрасными работами, в которых постоянно есть один изъян - график. Выглядит неплохо, но график явно не вписывается. Для того, чтобы график хорошо выглядел, он должен быть идеально симметричным. Я имею в виду, что расстояния между точками должны быть идентичными. Я решил создать простое наглядное руководство для того, чтобы показать вам процесс создания идеального графика. Этот гайд был создан в Sketch, но он будет работать в любом другом графическом редакторе, в котором есть инструмент “перо”. Одна из моих работ, в которой я использовал данный метод.
Создайте линию и продублируйте ее
Для начала создайте линию и продублируйте ее 10 раз. Сделайте расстояние между линиями в 41 пиксель (для этого примера). Для этого можно использовать Craft by InVision LABS. https://vimeo.com/198650438
Продублируйте группу линий
Далее, создайте группу линий и продублируйте ее. Задайте центр копируемой группы первой группой и измените прозрачность группы до 35%. Аккуратнее с позиционированием потому, что все должно быть идеальным. https://vimeo.com/198650428
Добавьте точки графика
Теперь просто придерживайтесь ваших линий. Помните, что направление точки идет от дескриптора и должно быть такой же ширины, как и пространство между точками графика… ну, это проще понять, если взглянуть на GIF. https://vimeo.com/198650423
Исходный файл
Если у вас возникли проблемы, я приготовил для вас исходный файл. Вы можете задать мне вопрос, если вам что-то непонятно. Я очень надеюсь, что этот гайд поможет вам в создании крутых дашбордов.
Перевод статьи Wojciech Zieliński
Топ коментарі (0)