Taplink давно стал любимым инструментом блогеров, экспертов и малого бизнеса - на нём можно быстро собрать мини-сайт с ссылками, услугами или даже полноценным лендингом. Но если хочется выделиться и сделать что-то по-настоящему креативное, лучше всего сначала создать дизайн в Figma. Ниже - пошаговый разбор, как это сделать.
Начинаем с создания фрейма. Оптимальная ширина - 1200 px, так ваш макет будет смотреться чётко и качественно на любых экранах. Высота зависит от количества блоков и контента, которые вы планируете добавить.
Далее используем базовые инструменты Figma:
- текстовые поля
- фигуры
- картинки в маске
Я, например, сгенерировала изображения при помощи нейросети и встроила их в дизайн первого блока. Получается очень быстро и современно.
Хотите обрезать картинку по форме? Для этого в Figma есть удобный инструмент «маска».
Следующий шаг - наполнение сайта полезными блоками: описание, услуги, преимущества, отзывы. Важно соблюдать визуальную иерархию: заголовки должны быть ярче, чем обычный текст, а отступы помогать пользователю «считывать» контент.
Интересный объект, который стоит добавить - это карта. Она может быть вставлена как изображение или как интерактивный элемент. В дизайне Taplink её можно обыграть разными способами: сделать фон для контактов, вынести отдельным блоком или использовать как акцент.
Без контактов сайт будет неполным. Этот блок повышает доверие и даёт пользователю возможность быстро связаться с вами: телефон, почта, соцсети или мессенджеры.
Чтобы собрать стильный сайт Taplink, достаточно двух вещей:
- навыков работы в Figma
- логического мышления, чтобы структурировать информацию
А если вы хотите прокачаться ещё больше и добавить «вау-эффект», советую посмотреть видео: Как сделать в Figma анимацию прокрутки экранов.