

Інформатика, висвітлено 16.02.2022
SiteForms | Figma
Практична робота з web-дизайну "SiteForms"
(створення реєстраційних форм для сайту)
1. Перейти до сервісу Figma за посиланням: https://bit.ly/3rSbxFT
2. Зареєструватись/аторизуватись на сервісі Figma, виберіть New design file
3. Створити форми за зразком (див. нижче)
* Frame 1: Y=0; W=750; H=600; Fill #1b2540
- Rectangle 1: Y=0; W=150; H=10; Fill #eb4aba
- Rectangle 2: Y=0; W=150; H=10; Fill #66ca97
- Rectangle 3: Y=0; W=150; H=10; Fill #735eea
- Rectangle 4: Y=0; W=150; H=10; Fill #cba860
- Rectangle 5: Y=0; W=150; H=10; Fill #6a94ff
- Text 1. Sing into your account: Roboto Bold; 18pt; X center; Y=120; W=340; H=35; Align center; color white
- Rectangle 6: Y=190; W=460; H=50; Fill #212a47; X center
- Text 2. E-mail: Roboto Bold; 18pt; Y=190; W=340; H=35; Align left; color #2f3752
- Rectangle 7: Y=270; W=460; H=50; Fill #212a47; X center
- Text 3. Password: Roboto Bold; 18pt; Y=270; W=340; H=35; Align left; color #2f3752
- Text 4. Sign up: Roboto Bold; 18pt; Y=350; W=340; H=35; Align left; color #3d5596
- Rectangle 8: Y=430; W=380; H=50; Fill #cba860; X center; corner radius 50
- Text 5. Sing in: Roboto Bold; 18pt; Y=430, W=340, H=35, Align center, color white
* Frame 2 (копія Frame 1) зміни див. зразок: Y=700; H=700
- відстань між прямокутниками 30
- кнопка Register: Y=550
* Frame 3 (копія Frame 2) зміни див. зразок: Y=1500; H=400
- кнопка Sing in: Y=200
4. Надіслати посилання створених форм: Share - Copy link

Додаткові матеріали
Відео

Додаткові матеріали
Фото


