OKEGUYS
  • Tutorial
    • Adobe
    • Ahrefs
    • Blogger
    • Canva
    • Google Adsense
    • Google Analyitcs
    • Google Documents
    • Google Tag Manager
    • Microsoft Office
    • SEO
    • UI/UX
    • WordPress
  • Fix It
    • Life Hack
    • How To Fix
  • Download
    • Download Apps
    • Download Games
  • Gadget
    • Camera
    • Smart TV
    • Smartphone
    • Smartwatch
    • Recommendation
  • Intermezzo
  • Anime
  • Games
  • News
No Result
View All Result
  • Login
  • Register
OKEGUYS
  • Tutorial
    • Adobe
    • Ahrefs
    • Blogger
    • Canva
    • Google Adsense
    • Google Analyitcs
    • Google Documents
    • Google Tag Manager
    • Microsoft Office
    • SEO
    • UI/UX
    • WordPress
  • Fix It
    • Life Hack
    • How To Fix
  • Download
    • Download Apps
    • Download Games
  • Gadget
    • Camera
    • Smart TV
    • Smartphone
    • Smartwatch
    • Recommendation
  • Intermezzo
  • Anime
  • Games
  • News
No Result
View All Result
OKEGUYS
Home Development UI/UX

Tutorial UI/UX: Buat Frame Website Sederhana di Figma

Langkah setelah kamu memahami dan telah dengan matang membuat konsep desain

vanvand by vanvand
Februari 23, 2021
Reading Time: 2min read
8 0
0
Buat Frame Website Figma

OKEGUYS – Ini adalah cara mudah membuat frame website menggunakan Figma, kamu gak akan bingung Guys dengan tutorialnya.

Langkah ini jika semua elemen yang kita pelajari sebelumnya sudah kamu mengerti. Seperti mengganti gambar sketsa dengan gambar asli, konten yang masih abu-abu dengan warna.

Penting untuk melakukan sedikit riset tentang jenis produk atau situs web yang akan kamu buat. Kebanyakan hal seringkali dapat diekstrapolasi dari logo, seperti jenis desain dan warna yang akan digunakan.

Buat Frame Website Sederhana di Figma

  1. Buka Figma, kamu bisa menggunakan fFigma di website atau pun dengan cara kamu mengunduh aplikasinya. Setelah itu jangan lupa untuk buat akun baru, karena untuk mengakses aplikasi ini membutuhkan akun Guys.
    Buat Frame Website Figma
  2. Seperti pada umunya, untuk memulai sebuah project kamu harus membuat file baru pada Figma. Kamu bisa klik tanda + pada bagian atas kanan layar.
  3. Buat frame desain website. Selanjutnya kamu pilih untuk desain website, karena memang kita ingin membuat project tersebut.

    Banyak pilihan project disana yang tersedia, tergantung apa yang ingin kamu buat nantinya. Lalu pilih ukuran standar pada desktop yaitu 1440 x 1024.

  4. RELATED POSTS

    Tutorial UI/UX: Coba Bikin UI di Figma #2

    Tutorial UI/UX: Coba Bikin UI di Figma #1

    Tutorial UI/UX: Mengenal Inspect Panel Figma dan Penggunaannya

  5. Setelah langkah tersebut lebih baiknya kamu ganti dulu nama file yang akan kamu jadikan project desain websitenya sesuai dengan yang kamu sedang kerjakan.
  6. Buat komponen awal yaitu header.
  7. Langkah terakhir ini kamu bisa menambahkan sebuah gambar ke dalam Figma dan membuat menu bar atau header ini ya Guys. Caranya cuma klik pada bagian button atas kiri pada layar lalu tambahkan komponen header ini.

    Buat Frame Website Figma
    Pada tahap ini, ada baiknya untuk memastikan bahwa header dan bagian ditampilkan dengan konten sebenarnya yang dimaksudkan untuk disimpan. Ini akan memungkinkan pemilihan warna dan gambar yang lebih baik pada tahap desain selanjutnya.

Jadi itulah tahap awal untuk pembuatan Desain website sederhana di Figma, selanjutnya kamu tinggal menambahkan konten-konten yang sesuai dengan konsep kamu aja.


Artikel Lainnya

  • Tahapan Penting Dalam UI/UX, Jangan Terlewat!
  • Perbedaan Wireframe, Prototype dan Mockup
  • Panduan Awal untuk Membuat Wireframe
  • Tips UI untuk Buta Warna
  • Macam-Macam Tipe Image List Terbaik
Tags: FigmaTutorial UIWireframe
Share1Tweet2Share3
vanvand

vanvand

Related Posts

Coba Bikin UI Figma
UI/UX

Tutorial UI/UX: Coba Bikin UI di Figma #2

Februari 26, 2021
Bikin UI Figma
UI/UX

Tutorial UI/UX: Coba Bikin UI di Figma #1

Februari 26, 2021
Mengenal Inspect Panel Figma
UI/UX

Tutorial UI/UX: Mengenal Inspect Panel Figma dan Penggunaannya

Februari 25, 2021
Cara Buat Kaca Buram Figma
UI/UX

Tutorial UI/UX: Cara Buat Efek Kaca Buram di Figma

Februari 25, 2021
Template Keren UI Figma
UI/UX

Tutorial UI/UX: Kumpulan Template Keren UI Figma

Februari 24, 2021
Cara Buat Auto Layout Figma
UI/UX

Tutorial UI/UX: Cara Buat Auto Layout di Figma dan Fungsinya

Februari 24, 2021
Next Post
Template Power Point Biru

Kumpulan Template Power Point Bernuansa Biru Gratis

Aplikasi Clubhorse Terblokir

China Bikin Aplikasi Bernama ClubHorse, Langsung Terblokir!

Discussion about this post

Recommended Stories

Aplikasi Mirip Clubhouse

Mirip Clubhouse, Ini Rekomendasi Aplikasi yang Juga Berbasis Audio

Februari 25, 2021
Fitur LiDAR iPhone 12

Fitur LiDAR iPhone 12 Pro Bisa Untuk Mengurangi Dampak Banjir

Februari 22, 2021
5 Rekomendasi Film India (Bollywood) Terbaik dan Populer

5 Rekomendasi Film India (Bollywood) Terbaik dan Populer

Maret 14, 2020

Popular Stories

  • film hot korea

    20 Film Korea Dewasa dengan Adegan Vulgar

    106475 shares
    Share 42591 Tweet 26619
  • 18+ Komik Dewasa Terlarang di Indonesia

    72093 shares
    Share 28838 Tweet 18023
  • Psst! 10 Anime Dewasa Khusus Kamu yang Dewasa

    40097 shares
    Share 16039 Tweet 10024
  • Cara Membuka Situs yang Diblokir Internet Positif

    15825 shares
    Share 6331 Tweet 3956
  • 7 Pegulat WWE yang Ukurannya Segede Raksasa

    13697 shares
    Share 5479 Tweet 3424
OKEGUYS

Misi untuk membantu semua orang mengasah keahlian digital dengan beragam serial tutorial. Mendukung semua orang untuk dapat berkarya di ranah digital.

© 2020 OKEGUYS - Beta Version

Limapagi Network by Fivesky Media

  • Editorial
  • Index
  • Privacy Policy
  • Cyber Media News Guidelines
No Result
View All Result
  • Tutorial
    • Adobe
    • Ahrefs
    • Blogger
    • Canva
    • Google Adsense
    • Google Analyitcs
    • Google Documents
    • Google Tag Manager
    • Microsoft Office
    • SEO
    • UI/UX
    • WordPress
  • Fix It
    • Life Hack
    • How To Fix
  • Download
    • Download Apps
    • Download Games
  • Gadget
    • Camera
    • Smart TV
    • Smartphone
    • Smartwatch
    • Recommendation
  • Intermezzo
  • Anime
  • Games
  • News

© 2021 JNews - Premium WordPress news & magazine theme by Jegtheme.

Welcome Back!

Sign In with Google
OR

Login to your account below

Forgotten Password? Sign Up

Create New Account!

Sign Up with Google
OR

Fill the forms bellow to register

All fields are required. Log In

Retrieve your password

Please enter your username or email address to reset your password.

Log In