У кожного дизайнера існує своя система щодо структурування роботи в Figma. Але, все ж таки, є певні правила, які допоможуть тобі не загубитися у компонентах проєкту та запобігти хаосу. Особливо, коли ти працюєш в команді.
Організація сторінок
Всередині проєкту у вас буде декілька обов’язкових сторінок. Знову ж, вони можуть відрізнятися в залежності від того, як ви звикли працювати, проте є база:
- Mockups — основний файл, в якому ми працюємо.
- References — добірка візуальних матеріалів, які допомагали нам створювати дизайн або були надіслані клієнтом.
- Components — тут лежать усі компоненти, які ми використовуємо в проєкті.
- Backlog — тут зберігаються файли, які не були використані в основному макеті.
- Cover — обкладинка, яка буде висвічуватися в прев’ю нашого файлу.
Назви макетів
Перше ніж перейти до назв, слід вирівняти макети по осі X та Y. Інакше існує вірогідність того, що коли ти або хтось інший зайде у файл — не побачить нічого, бо макети посунулися в якийсь інший бік. Також вирівнюємо їх по вертикалі та робимо між ними однакову відстань.
Щодо назв макетів — існує система, яку ми намагаємось використовувати всюди:
- Номер flow.
У нас може бути багато сторінок і всі вони будуть відноситись до різних частин сайту чи продукту. Тому ми називаємо їх різними цифрами. - Номер екрану.
- Назва сторінки (наприклад, Home page).
- Вказуємо розмір макету у квадратних дужках (наприклад Dekstop [1920]).
- Використовуємо емоджі (cntrl+cmmnd+space) для того, щоб позначити статус. Наприклад, палітра — якщо макет ще малюється. Галочка — якщо макет готовий.
Це основні правила, які допоможуть тобі структурувати робочий простір і легко в ньому орієнтуватися. Дізнавайся більше лайфхаків та ставай упевненим юзером Figma на курсі від Merge Academy!
