Safitriann Portofolio Website
Safitriann Portofolio Website
UI/UX Designer, Web Developer, Content Writer
UI/UX Designer, Web Developer, Content Writer
Apr 28, 2023
Apr 28, 2023
Projek ini merupakan kebimbangan dari seorang pekerja yang ingin memiliki penghasilan tambahan untuk memenuhi kebutuhan sehari-hari, dengan segala pertimbangan waktu dan situasi, maka ia memutuskan untuk fokus mendapatkan proyek pertamanya sebagai freelancer UI/UX Designer.
Website ini diharapkan dapat mengubah portfolio agar terlihat lebih profesional dalam menunjukkan skill, kualitas diri, juga proyek yang telah dikerjakan sebelumnya. Website ini bertujuan untuk memudahkan calon klien atau recruiter dalam mengetahui skill persona, sehingga mereka tertarik dan merekrutnya sebagai UI/UX Designer atau web designer dalam proyek yang akan dijalankan.
Timeline Pengerjaan
Research
Dimulai dengan meresearch beberapa contoh website portfolio dari beberapa website yang dipilih, juga dengan mengikuti kelas UI/UX pembuatan website portfolio guna mengetahui hal-hal yang perlu diperhatikan saat akan membuat desain tersebut. Ditemukan beberapa kebutuhan user dalam pembuatan website portfolio sebagai berikut:
User Tasks
Dapat mengenal freelancer tersebut
Dapat melihat proyek yang pernah dikerjakan
Dapat membaca details proyek yang dimiliki
Dapat menghubungi freelancer dengan mudah
Dapat melihat gallery desain yang telah dikerjakan
Key Points
Professional
Details
Minimalist
Cheerful
Study Case
Pages
Landing Page
Project Details Page
Gallery Page
About Page
Contact Page
Dari hasil research ini, bisa dilihat kebutuhan user dalam pembuatan website dari setiap section page yang diinginkan. Kemudian dapat dilanjutkan dengan tahap solusi desain, yang mana desain website ini dibuat berdasarkan lingkup/scope yang telah dijelaskan beserta tema dan page yang dibutuhkan. Sehingga, saat melakukan proses desain interface, desain page yang dibuat tetap pada scopenya dan dapat diselesaikan tepat waktu sesuai dengan timeline yang diberikan.
Wireframe
Pada tahap ini, cukup dengan membuat gambaran dasar mengenai section dan kebutuhan user yang akan ditampilkan di setiap page dengan dibuat secara langsung (digambar dengan pena/pensil) atau dengan menggunakan tools pembuatan wireframe. Dalam proyek ini, wireframe dibuat dengan menggunakan tools whimsical.
Design Interface
Tahap ini adalah tahap yang paling menyenangkan, membuat desain tampilan website. Dimulai dengan pembuatan desain page yang paling mudah hingga desain page yang kompleks/beragam.
Web Development
Ini adalah tahap yang rumit sekaligus mengasyikkan, banyak hal-hal baru dan perlu dipelajari dari segi editing desain, input aset, layouting, animation, CMS, dll. Hingga tak terasa telah menghabiskan banyak waktu berhari-hari untuk sekedar mempelajarinya sampai dapat mempraktekkannya.
Dalam tahap ini, tools yang digunakan adalah framer. Sebuah online tools pembuatan website gratis dan mudah untuk dipelajari tanpa menggunakan coding dengan tampilan dan fungsi yang mirip/familiar bagi pengguna Figma.
Content Writing
Hal yg sangat penting dan krusial yg kadang suka terlewat adalah isi konten yg akan ditampilkan. Saat proses pembuatan desain, yang didahulukan hanya teks judul/utama, subkategori setiap section dan hanya memberikan lorem ipsum untuk isi konten di setiap sectionnya.
Tahap ini menjadi salah satu hal yang membuat proses pembuatan website portfolio berlangsung lama. Kendala yang dihadapi adalah dalam mempersiapkan dan melengkapi kata-kata dari setiap halaman juga penulisan artikel dari beberapa proyek yang akan ditampilkan.
Dari proyek ini banyak pelajaran yang didapat, pentingnya disiplin waktu pengerjaan agar proyek dapat diselesaikan lebih cepat, dan perlu memperhatikan lebih detail mengenai konsistensi pemberian aset dan warna.
Projek ini merupakan kebimbangan dari seorang pekerja yang ingin memiliki penghasilan tambahan untuk memenuhi kebutuhan sehari-hari, dengan segala pertimbangan waktu dan situasi, maka ia memutuskan untuk fokus mendapatkan proyek pertamanya sebagai freelancer UI/UX Designer.
Website ini diharapkan dapat mengubah portfolio agar terlihat lebih profesional dalam menunjukkan skill, kualitas diri, juga proyek yang telah dikerjakan sebelumnya. Website ini bertujuan untuk memudahkan calon klien atau recruiter dalam mengetahui skill persona, sehingga mereka tertarik dan merekrutnya sebagai UI/UX Designer atau web designer dalam proyek yang akan dijalankan.
Timeline Pengerjaan
Research
Dimulai dengan meresearch beberapa contoh website portfolio dari beberapa website yang dipilih, juga dengan mengikuti kelas UI/UX pembuatan website portfolio guna mengetahui hal-hal yang perlu diperhatikan saat akan membuat desain tersebut. Ditemukan beberapa kebutuhan user dalam pembuatan website portfolio sebagai berikut:
User Tasks
Dapat mengenal freelancer tersebut
Dapat melihat proyek yang pernah dikerjakan
Dapat membaca details proyek yang dimiliki
Dapat menghubungi freelancer dengan mudah
Dapat melihat gallery desain yang telah dikerjakan
Key Points
Professional
Details
Minimalist
Cheerful
Study Case
Pages
Landing Page
Project Details Page
Gallery Page
About Page
Contact Page
Dari hasil research ini, bisa dilihat kebutuhan user dalam pembuatan website dari setiap section page yang diinginkan. Kemudian dapat dilanjutkan dengan tahap solusi desain, yang mana desain website ini dibuat berdasarkan lingkup/scope yang telah dijelaskan beserta tema dan page yang dibutuhkan. Sehingga, saat melakukan proses desain interface, desain page yang dibuat tetap pada scopenya dan dapat diselesaikan tepat waktu sesuai dengan timeline yang diberikan.
Wireframe
Pada tahap ini, cukup dengan membuat gambaran dasar mengenai section dan kebutuhan user yang akan ditampilkan di setiap page dengan dibuat secara langsung (digambar dengan pena/pensil) atau dengan menggunakan tools pembuatan wireframe. Dalam proyek ini, wireframe dibuat dengan menggunakan tools whimsical.
Design Interface
Tahap ini adalah tahap yang paling menyenangkan, membuat desain tampilan website. Dimulai dengan pembuatan desain page yang paling mudah hingga desain page yang kompleks/beragam.
Web Development
Ini adalah tahap yang rumit sekaligus mengasyikkan, banyak hal-hal baru dan perlu dipelajari dari segi editing desain, input aset, layouting, animation, CMS, dll. Hingga tak terasa telah menghabiskan banyak waktu berhari-hari untuk sekedar mempelajarinya sampai dapat mempraktekkannya.
Dalam tahap ini, tools yang digunakan adalah framer. Sebuah online tools pembuatan website gratis dan mudah untuk dipelajari tanpa menggunakan coding dengan tampilan dan fungsi yang mirip/familiar bagi pengguna Figma.
Content Writing
Hal yg sangat penting dan krusial yg kadang suka terlewat adalah isi konten yg akan ditampilkan. Saat proses pembuatan desain, yang didahulukan hanya teks judul/utama, subkategori setiap section dan hanya memberikan lorem ipsum untuk isi konten di setiap sectionnya.
Tahap ini menjadi salah satu hal yang membuat proses pembuatan website portfolio berlangsung lama. Kendala yang dihadapi adalah dalam mempersiapkan dan melengkapi kata-kata dari setiap halaman juga penulisan artikel dari beberapa proyek yang akan ditampilkan.
Dari proyek ini banyak pelajaran yang didapat, pentingnya disiplin waktu pengerjaan agar proyek dapat diselesaikan lebih cepat, dan perlu memperhatikan lebih detail mengenai konsistensi pemberian aset dan warna.
Let's Work Together!
Let's Work Together!
If we can't keep up with the times
we can only feel left behind
If we can't keep up with the times
we can only feel left behind
Hire Me