Anda di halaman 1dari 20

Website Planning & Development

Methodology

5 CARA PANDANG YANG SALAH


TERHADAP WEBSITE ORGANISASI

Website Sebagai Brosur

Website tidak berpengaruh


terhadap citra organisasi

Website tidak perlu dikelola

Cukup punya FB/Twitter, Website


Organisasi tidak penting

Website tidak mendatangkan benefit


bagi organisasi

4 KESALAHAN YANG SERING TERJADI DALAM


TATA KELOLA WEBSITE ORGANISASI

Pengelolaan web hanya diserahkan ke 1 orang

Kunci utama akses website yaitu domain,


hosting dan akses administrator (CMS) website
tidak berada di tangan organisasi

Staf organisasi tidak terlibat dalam proses


perancangan website

Pimpinan tidak terlibat dalam pengembangan


dan pengelolaan website organisasi

3 KUNCI AWAL KEBERHASILAN WEBSITE

Pimpinan/Manajemen Organisasi terlibat dalam


perencanaan, pembangunan, pemantapan dan
pengembangan website

Pengembangan website mengikuti metodologi


standar dan disesuaikan dengan ketersediaan
content/materi

Content is the King! Sejatinya website adalah


ruang atau media penyajian data, informasi dan
pengetahuan organisasi, sehingga ketersediaan
content menjadi krusial dalam pengembangan
website

KERANGKA STRATEGI WEBSITE

METODOLOGI PERENCANAAN WEBSITE


TUJUAN STRATEGIS
Target Pengunjung
Arsitektur Informasi
Kebutuhan Internal Organisasi

Kebutuhan Target Pengunjung

Key Message & Key Visual


Design (Warna, tata letak, font, background)

Pesan kunci yang ingin disampaikan

Pengumpulan & Pembuatan Content


Tulisan

Gambar

PDF

Photo

Video

Analy6c

Security

Spesikasi Teknis
Domain

Hos6ng

Pla8orm CMS

Pembangunan Website

CONTOH PERUMUSAN TUJUAN STRATEGIS & TARGET PENGUNJUNG

Tujuan Strategis

Target
Pengunjung

Segmentasi Pengunjung

Mendapatkan Sumber
Pendanaan dari lembaga Donor

Donor

Donor Amerika, Australia

Menyebarluaskan pengetahuan
tentang gerakan sosial

Mahasiswa

Mahasiswa Fisip di wilayah Jawa

Memperkuat jaringan kemitraan LSM lokal yang


dengan LSM Lokal
menangani isu
pemberdayaan
komunitas

Para pimpinan LSM lokal di


wilayah Sulawesi dan Kalimantan

Mendorong terjadinya
perubahan kebijakan untuk isu
pengentasan kemiskinan di
wilayan Sulawesi

Pemerintah daerah di wilayah


sulawesi, media-media lokal di
wilayah sulawesi

Pemerintah &
Media

PERUMUSAN ARSITEKTUR INFORMASI

DASAR PEMIKIRAN

1. Pendenisan Kebutuhan Internal
Organisasi

Apa sajakah informasi yang ingin anda publikasikan


ke target sasaran ?

2. Pendenisan Kebutuhan Target


Pengunjung

Apa sajakah informasi yang dibutuhkan oleh target


sasaran Anda terhadap organisasi Anda?

PERUMUSAN ARSITEKTUR INFORMASI

Tujuan Strategis: Mendapatkan Sumber Pendanaan dari lembaga Donor


Target Sasaran: Lembaga Donor dari Amerika & Australia

Kebutuhan Internal Organisasi

1. Menunjukkan ke donor bahwa organisasi memiliki pengalaman dan


kompetensi dalam menjalankan program penguatan ekonomi komunitas
masyarakat miskin
2. Menunjukkan ke donor hasil-hasil pencapaian kerja organisasi selama ini
3. Menunjukkan kekuatan jaringan dan kemitraan yang dimiliki organisasi

Kebutuhan Target Pengunjung


1.
2.
3.

Donor membutuhkan prol organisasi dalam bahasa Inggris dan informai tersebut
bisa ditemukan ke6ka dicari melalui mesin pencarian seper6 Google dan Bing.
Donor membutuhkan informasi mengenai legalitas, dan akuntabilitas organisasi
Donor membutuhkan informasi berapa dana yang bisa dikelola oleh organisasi dari
program-program yang pernah dijalankan sebelumnya.

PERUMUSAN ARSITEKTUR INFORMASI

LOGO DAN
TAGLINE

BERANDA

KAMAR

PILIHAN
BAHASA

CONTENT
UNGGULAN

NAVIGASI

CONTENT
DINAMIS

PROFIL
ORGANISASI

PROGRAM

Visi & Misi

Pemberdayaan
Masyarakat

Program
berjalan

Peneli6an

Program
yang lalu

Sejarah
Struktur Org.
Prol Staf
Laporan audit
Partner

Pengembangan
Ekonomi

PORTFOLIO

BANNER
IDENTITAS

CONTENT
VISUAL

INFORMASI
KONTAK

CONTENT
STRATEGIS

KABAR/BERITA

PUSTAKA

GALERI

Liputan Kegiatan

Panduan

Foto

Kliping Media

Bule6n

Video

Siaran Pers

Buku

Audio

Agenda

Majalah

PERUMUSAN ARSITEKTUR INFORMASI

Langkah Mendesain Tata Letak Halaman Utama Website


Identifikasi Komponen
Halaman Utama
CONTENT
UNGGULAN

CONTENT
DINAMIS
LOGO DAN
TAGLINE

CONTENT
PENTING
PILIHAN
BAHASA

Wireframe

NAVIGASI

CONTENT
VISUAL

CONTENT
STRATEGIS

Visualisasi
IDENTITAS

Mockup/
Layout Style Prototype

Strategis

Pen6ng
Unggulan
Dinamis

PERUMUSAN KEY MESSAGE & KEY VISUAL

Key Message
1. Tagline/jargon organisasi:

2. Pesan-Pesan Pen6ng untuk di
image slider halaman depan:
Contoh:
- Slider di website
h^p://www.upacaya.com/

Key Visual
1. Logo

2. Nuansa Warna
Contoh: Biru dan Orange (sesuai
logo)

3. Foto-foto yang mewakili pesan
kunci

4. Garis Desain
Tegas atau Lentur/Lengkung

5. Konsep gambar:
black and white atau Ilustrasi
Kartun atau Foto

PEMBUATAN & PENGUMPULAN CONTENT

Da_ar Content
yang belum ada
dan harus dibuat
1.
2.
3.
4.
5.

.
.
.
.
.

Da_ar Content
yang sudah ada
dan harus
dikumpulkan
1.
2.
3.
4.
5.


.
.
.
.

Da_ar Content
Da_ar content
yang sudah ada
visual yang
dan harus ditulis dimiliki organisasi
ulang/dikoreksi
1.
2.
3.
4.
5.


.
.
.
.

1. Logo
2. Poster
3. Company
Prole
4. Icon
5. Ilustrasi
6. dll

PEMBUATAN & PENGUMPULAN CONTENT

Contoh Pola Produksi Content


No

MENU

SUB MENU

FORMAT DATA

FREKWENSI
UPDATE

Tentang Kami Sejarah, Visi dan Misi Text, Photo

Jarang/Sta6k

Struktur Organisasi

Gambar bagan

Jarang/Sta6k

Laporan Audit

PDF

Per tahun

Berita
Kegiatan

Text, Photo, Video

Per minggu

Siaran Pers

PDF

2 Bulan
sekali

Event

Text, Gambar banner


event

1 bulan
sekali

Publikasi

Buku

PDF + Gambar Cover +


Text Abstraksi Buku

6 bulan
sekali

Bulle6n

PDF + Gambar Cover +


Text Abstraksi Buku

1 bulan
sekali

PERUMUSAN SPESIFIKASI TEKNIS

No

Item

Spesikasi

1.

Nama Domain

www.namadomain.org

2.

Hos6ng Server

Pla8orm CMS

Wordpress (atau Joomla, atau Drupal, atau


Tailor Made CMS)

Security

- Level: Medium
- Basic rules: strong password, limit login, etc.
- Integrasi dengan Google Webmaster Tools

5.

Analy6c Pla8orm

Google Analy6c

6.

User Interface

Kompa6bel dengan berbagai macam browser,


mobile friendly/responsive design

7.

Addi6onal Feature

Forum, Membership, Product Catalog,


Visualisasi grak, etc

Sistem Operasi: Linux


Hos6ng Panel: Cpanel
Space: . GB
Bandwidh Quota: GB
RAM: .. MB/GB
Lokasi server: Indonesia/US

PEMBANGUNAN WEBSITE

Contoh Timeline Pembangunan Website


Rencana Kerja

Bulan ke-1

Bulan ke-2

Bulan ke-3

Durasi

Lokasi

2 hari

On Site

2 minggu

O Site

Perancangan desain tampilan website mengacu


kepada arsitektur informasi website

1 minggu

O Site

Pembuatan website dan penyediaan fungsi yang


dibutuhkan

3 - 4 minggu

O Site

1 hari

O site

3 - 4 minggu

O Site

1 hari

On Site

1 minggu

O Site

2 hari

O Site

1 hari

O Site

1 hari

O Site

O Site

2 hari

On Site

Fasa Perancangan
FGD perancangan arsitektur content website +
Assessment Infrastruktur
Pengumpulan & Pembuatan content website
Fasa Pembangunan

Setup Nama domain dan web hos6ng server


Pengolahan data dan entri data ke dalam website.
Presentasi Versi Beta
Finalisasi desain dan fungsional website baru
Presentasi website versi Final & Uji coba fungsi +
tampilan website.
Fasa Finalisasi
Upload website baru ke server
Uji Coba Kompa6bilitas, Instalasi sistem keamanan
standar website + Integrasi website dengan Google
Analy6c dan Google webmaster tools
Launching website baru
Pela6han bagi Pengelola Website

Pengujian Website
Metode:
1. Pengujian User Interface
- Popular Browser
- Multi Gadget (Laptop, tablet, Smartphone)
2. Pengujian Fungsional
- Posting
- Modifikasi
- Search
- Export/Import
- Broken link checker
- Speed test

WEB SECURITY
Teknis Website
Wordpress Security
Server Security
Network Security

Teknis Non Website


Computer Security
LAN/Wi-Fi Security
Email Security
Data Storage
Security

Non Teknis
Aturan Hak Akses
Pemegang Akses
Utama