Website Planning & Development Methodology

1

2

3

4

5

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

1

2

3

4

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

1

2

3

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

Pembangunan  Website  

Spesifikasi  Teknis  Domain   Hos6ng   Pla8orm  CMS   Analy6c   Security  

Pengumpulan  &  Pembuatan  Content  Tulisan   Gambar   PDF   Photo   Video  

Key  Message  &  Key  Visual  Pesan  kunci  yang  ingin  disampaikan   Design  (Warna,  tata  letak,  font,  background)  

Arsitektur  Informasi  Kebutuhan  Internal  Organisasi   Kebutuhan  Target  Pengunjung  

Target  Pengunjung  

TUJUAN  STRATEGIS  

METODOLOGI PERENCANAAN 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  dengan  LSM  Lokal  

LSM  lokal  yang  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  &  Media  

Pemerintah  daerah  di  wilayah  sulawesi,  media-­‐media  lokal  di  wilayah  sulawesi  

DASAR  PEMIKIRAN    

1.   Pendefinisan  Kebutuhan  Internal  Organisasi  Apa  sajakah  informasi  yang  ingin  anda  publikasikan  ke  target  sasaran  ?  

2.   Pendefinisan  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.  Donor  membutuhkan  profil  organisasi  dalam  bahasa  Inggris  dan  informai  tersebut  

bisa  ditemukan  ke6ka  dicari  melalui  mesin  pencarian  seper6  Google  dan  Bing.  2.  Donor  membutuhkan  informasi  mengenai  legalitas,  dan  akuntabilitas  organisasi  3.  Donor  membutuhkan  informasi  berapa  dana  yang  bisa  dikelola  oleh  organisasi  dari  

program-­‐program  yang  pernah  dijalankan  sebelumnya.    

PERUMUSAN  ARSITEKTUR  INFORMASI  

LOGO  DAN  TAGLINE   NAVIGASI  

CONTENT  UNGGULAN  

BANNER  IDENTITAS  

CONTENT    VISUAL  BERANDA  

PILIHAN  BAHASA  

INFORMASI  KONTAK  

PROFIL  ORGANISASI   PROGRAM   KABAR/BERITA   PUSTAKA   GALERI  

KAMAR  

CONTENT  DINAMIS  

CONTENT  STRATEGIS  

Visi  &  Misi  

Sejarah  

Struktur  Org.  

Profil  Staf  

Pemberdayaan  Masyarakat  

Peneli6an  

Foto  

Video  

Audio  

Panduan  

Bule6n  

Buku  

Liputan  Kegiatan  

Kliping  Media  

Siaran  Pers  

Majalah  

Laporan  audit  

Partner  

Agenda  

PORTFOLIO  

Program  berjalan  

Program  yang  lalu  

Pengembangan  Ekonomi  

PERUMUSAN  ARSITEKTUR  INFORMASI  

Langkah Mendesain Tata Letak Halaman Utama Website

Identifikasi Komponen Halaman Utama

CONTENT  UNGGULAN  

CONTENT    VISUAL  

CONTENT  DINAMIS  

CONTENT  STRATEGIS  

LOGO  DAN  TAGLINE   NAVIGASI   Visualisasi  

IDENTITAS  PILIHAN  BAHASA  

Wireframe Mockup/ Layout Style Prototype

CONTENT    PENTING  

PERUMUSAN  ARSITEKTUR  INFORMASI  

Strategis  

Unggulan  

Pen6ng  

Dinamis  

PERUMUSAN  KEY  MESSAGE  &  KEY  VISUAL  

Key  Message   Key  Visual  1.  Tagline/jargon  organisasi:  

…………………………………  2.  Pesan-­‐Pesan  Pen6ng  untuk  di  

image  slider  halaman  depan:  Contoh:  -­‐  Slider  di  website  h^p://www.upacaya.com/    

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  

Da_ar  Content  yang  sudah  ada  

dan  harus  dikumpulkan  

Da_ar  Content  yang  sudah  ada  dan  harus  ditulis  ulang/dikoreksi  

Da_ar  content  visual  yang  

dimiliki  organisasi  

1.  ….  2.  ….  3.  ….  4.  ….  5.  ….  

1.  …  2.  ….  3.  ….  4.  ….  5.  ….  

1.  …  2.  ….  3.  ….  4.  ….  5.  ….  

1.  Logo  2.  Poster  3.  Company  

Profile  4.  Icon  5.  Ilustrasi  6.  dll  

PEMBUATAN  &  PENGUMPULAN  CONTENT  

No   MENU   SUB  MENU   FORMAT  DATA   FREKWENSI  UPDATE  

1   Tentang  Kami   Sejarah,  Visi  dan  Misi   Text,  Photo   Jarang/Sta6k  

2   Struktur  Organisasi   Gambar  bagan   Jarang/Sta6k  

3   Laporan  Audit   PDF   Per  tahun  

4   Berita  Kegiatan  

Text,  Photo,  Video   Per  minggu  

5   Siaran  Pers   PDF   2  Bulan  sekali  

6   Event   Text,  Gambar  banner  event  

1  bulan  sekali  

7   Publikasi   Buku   PDF  +  Gambar  Cover  +  Text  Abstraksi  Buku  

6  bulan  sekali  

8   Bulle6n   PDF  +  Gambar  Cover  +  Text  Abstraksi  Buku  

1  bulan  sekali  

Contoh  Pola  Produksi  Content  

PERUMUSAN  SPESIFIKASI  TEKNIS  

No   Item   Spesifikasi  

1.   Nama  Domain   www.namadomain.org  

2.   Hos6ng  Server   •  Sistem  Operasi:  Linux  •  Hos6ng  Panel:  Cpanel  •  Space:  ….  GB  •  Bandwidh  Quota:  …  GB  •  RAM:  …..  MB/GB    •  Lokasi  server:  Indonesia/US  

3   Pla8orm  CMS   Wordpress  (atau  Joomla,  atau  Drupal,  atau  Tailor  Made  CMS)  

4   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  grafik,  etc  

PEMBANGUNAN  WEBSITE  

Rencana  Kerja Durasi Lokasi Bulan  ke-­‐1   Bulan  ke-­‐2   Bulan  ke-­‐3  

1   2   3   4   1   2   3   4   1   2   3   4  

Fasa  Perancangan                                                          

FGD  perancangan  arsitektur  content  website  +  Assessment  Infrastruktur

2  hari   On  Site                                                  

Pengumpulan  &  Pembuatan  content  website 2  minggu   Off  Site                                                  

Fasa  Pembangunan                                                          

Perancangan  desain  tampilan  website  mengacu  kepada  arsitektur  informasi  website

1  minggu   Off  Site                                                  

Pembuatan  website  dan  penyediaan  fungsi  yang  dibutuhkan  

3  -­‐  4  minggu   Off  Site                                                  

Setup  Nama  domain  dan  web  hos6ng  server   1  hari   Off  site  

Pengolahan  data  dan  entri  data  ke  dalam  website.   3  -­‐  4  minggu   Off  Site                                                  

Presentasi  Versi  Beta 1  hari   On  Site                                                  

Finalisasi  desain  dan  fungsional  website  baru 1  minggu   Off  Site                                                  

Presentasi  website  versi  Final  &  Uji  coba  fungsi  +  tampilan  website.

2  hari   Off  Site                                                  

Fasa  Finalisasi                                                        

Upload  website  baru  ke  server 1  hari   Off  Site                                                  

Uji  Coba  Kompa6bilitas,  Instalasi  sistem  keamanan  standar  website  +  Integrasi  website  dengan  Google  Analy6c  dan  Google  webmaster  tools

1  hari   Off  Site                                                  

Launching  website  baru     Off  Site                                                  

Pela6han  bagi  Pengelola  Website 2  hari   On  Site                                                  

Contoh  Timeline  Pembangunan  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   Non  Teknis  

Aturan  Hak  Akses  

Pemegang  Akses  Utama  

Computer  Security  

LAN/Wi-­‐Fi  Security  

Email  Security  

Data  Storage  Security