STUDI KASUS

Transformasi Digital PT Zumatic Saka Persada: Dari Kompleks ke Sederhana

Willya Randika |
Studi Kasus Redesign Website PT Zumatic Saka Persada

Terkadang, proyek yang dimulai sebagai perbaikan sederhana berkembang menjadi transformasi menyeluruh yang mengubah cara klien mengelola bisnis digital mereka.

Itulah yang terjadi dengan PT Zumatic Saka Persada, klien lama saya yang pertama kali menghubungi saya pada 11 September 2023 untuk mengatasi masalah-masalah teknis website mereka. Yang dimulai sebagai permintaan perbaikan spam contact form dan update PHP, berkembang menjadi proyek redesign komprehensif yang mengubah total cara mereka mengelola kehadiran digital perusahaan.

Perjalanan ini dimulai ketika mereka kembali menghubungi saya pada 5 Juni 2025 dengan keinginan untuk menyederhanakan pengelolaan website dan migrasi ke WordPress blocks. Setelah diskusi mendalam via WhatsApp, kami sepakat bahwa website mereka membutuhkan lebih dari sekadar perbaikan teknis – mereka memerlukan transformasi digital menyeluruh.

Website lama mereka menghadapi berbagai tantangan: tampilan yang kurang modern, copywriting yang tidak menjual, SEO yang tidak optimal, performa yang lambat, dan yang paling krusial – sistem pengelolaan yang sangat teknis dan sulit digunakan oleh tim non-teknis.

Dengan visi untuk menciptakan platform digital yang tidak hanya performa tinggi tetapi juga mudah dikelola, dimulailah proyek redesign yang akan mengubah cara PT Zumatic Saka Persada berinteraksi dengan website mereka.

Tantangan yang Dihadapi

Masalah Teknis yang Menumpuk

Ketika pertama kali dihubungi pada September 2023, PT Zumatic Saka Persada menghadapi berbagai masalah teknis yang mengganggu operasional website mereka:

Masalah Keamanan dan Maintenance:

  • Website sering menerima spam dari contact form
  • WordPress tidak ter-maintenance dengan baik (masih menggunakan PHP 7.2)
  • Beberapa plugin tidak kompatibel karena membutuhkan minimal PHP 7.4

Masalah User Experience:

  • Design UI yang tidak ramah pengguna
  • Tabel project dibuat dengan raw HTML yang sangat sulit diedit
  • Design website yang tidak mencerminkan profesionalisme perusahaan

Performa Website yang Mengkhawatirkan

Audit performa awal menunjukkan kondisi yang cukup memprihatinkan:

Skor PageSpeed Insights Sebelum Optimasi:

  • Mobile: 53 performance, 93 accessibility, 96 best practices, 85 SEO
  • Desktop: 81 performance, 98 accessibility, 96 best practices, 85 SEO

Browser Speed Test Results (Before):

  • 122 requests
  • 3.1 MB transferred
  • 7.0 MB total resources
  • 3.33s finish time
  • 1.35s DOMContentLoaded

Before Zumatic Performance

Visual Comparison: Before vs After

Transformasi visual website PT Zumatic sangat mencolok. Perbandingan homepage menunjukkan evolusi dari design yang outdated menjadi tampilan modern yang profesional:

Before (Homepage Lama):

  • Layout yang kaku
  • Content yang tidak terstruktur dengan baik

Before About Page

After (Homepage Baru):

  • Design modern dengan layout yang clean
  • Typography hierarchy yang jelas
  • Brand colors yang konsisten
  • Navigation yang intuitif
  • Content yang terorganisir dengan baik

After Homepage

Transformasi Halaman Kontak

Salah satu improvement signifikan adalah pada halaman kontak yang sebelumnya sangat basic menjadi interface yang lebih user-friendly dan professional:

After Contact Page

Kompleksitas Pengelolaan Konten

Salah satu tantangan terbesar adalah sistem pengelolaan konten yang sangat teknis:

  • Tabel project dengan raw HTML yang membutuhkan pengetahuan coding untuk edit
  • 20 plugin aktif termasuk WPBakery Page Builder yang kompleks
  • Slider Revolution yang berat dan sulit dikonfigurasi
  • Tidak ada standarisasi dalam pengelolaan konten

Pendekatan dan Metodologi

Analisis Komprehensif

Saya memulai dengan audit menyeluruh yang mencakup:

  1. Audit Teknis: Analisis performa, keamanan, dan kompatibilitas
  2. Audit UX/UI: Evaluasi pengalaman pengguna dan antarmuka
  3. Audit Konten: Review copywriting dan struktur informasi
  4. Audit SEO: Pemeriksaan optimasi mesin pencari
  5. Audit Workflow: Analisis proses pengelolaan konten

Strategi Transformasi

Berdasarkan hasil audit, saya mengembangkan strategi transformasi yang fokus pada tiga pilar utama:

1. Simplifikasi Teknologi

  • Migrasi dari WPBakery ke GenerateBlocks Pro
  • Pengurangan plugin dari 20 menjadi 15 plugin yang optimal
  • Implementasi GeneratePress sebagai tema dasar

2. Optimasi Performa

  • Optimasi kode dan aset
  • Implementasi caching yang efektif
  • Kompresi dan optimasi gambar

3. User-Friendly Management

  • Sistem pengelolaan konten yang intuitif
  • Custom plugin untuk kebutuhan multilingual
  • Integrasi ACF untuk manajemen project yang mudah

Implementasi Teknis

1. Migrasi Tema dan Page Builder

Dari WPBakery ke GenerateBlocks Pro:

Saya mengganti seluruh sistem page builder dari WPBakery yang kompleks ke GenerateBlocks Pro yang lebih ringan dan user-friendly. Keputusan ini didasarkan pada:

  • Performa Superior: GenerateBlocks menghasilkan kode yang lebih bersih dan ringan
  • Kemudahan Penggunaan: Interface yang lebih intuitif untuk pengguna non-teknis
  • Fleksibilitas: Dapat disesuaikan untuk berbagai kebutuhan tanpa bloat
  • Maintenance: Lebih mudah dimaintain dan diupdate

GeneratePress sebagai Foundation:

Pemilihan GeneratePress sebagai tema dasar memberikan:

  • Kode yang sangat ringan dan optimal
  • Kompatibilitas tinggi dengan GenerateBlocks
  • Customization yang tidak terbatas
  • Support jangka panjang yang terpercaya

2. Custom Plugin Development

Plugin Multilingual Khusus:

Salah satu tantangan unik adalah kebutuhan multilingual yang spesifik. PT Zumatic hanya membutuhkan fitur bahasa ganda (Indonesia/English) untuk halaman Insights & News saja. Saya mengembangkan custom plugin yang:

  • Targeted Implementation: Hanya aktif di halaman blog/insights
  • Simple Switching: Button toggle bahasa yang mudah digunakan
  • Backend Integration: Sistem pengelolaan yang terintegrasi dengan WordPress admin

Zumatic Multilingual Backend

Sistem multilingual yang saya kembangkan memungkinkan admin untuk dengan mudah mengelola konten dalam dua bahasa. Interface di atas menunjukkan bagaimana admin dapat:

  1. Menambahkan artikel baru dengan interface yang clean dan user-friendly
  2. Mengatur bahasa artikel melalui dropdown sederhana
  3. Menghubungkan versi bahasa yang berbeda dari artikel yang sama
  4. Preview konten sebelum publikasi

Keunggulan sistem ini:

  • Targeted Implementation: Hanya aktif di halaman yang membutuhkan
  • Simple Interface: Tidak membingungkan user dengan opsi yang tidak perlu
  • Efficient Management: Satu dashboard untuk kelola semua bahasa

ACF Integration untuk Project Management:

Untuk menggantikan sistem tabel raw HTML yang rumit, saya mengembangkan:

  • Custom Post Type untuk projects dengan field yang terstruktur
  • ACF Integration untuk input data yang user-friendly
  • Custom Filter System menggunakan GenerateBlocks Pro query blocks
  • Automated Layout yang konsisten untuk semua project

Zumatic Project Management

Interface manajemen project di atas menunjukkan transformasi dari sistem raw HTML yang rumit menjadi form yang user-friendly. Fitur-fitur yang tersedia:

Project Information Management:

  • End User: Input client information dengan mudah
  • Industry Selection: Dropdown untuk kategori industri
  • Location & Year: Field terstruktur untuk data project
  • Status Tracking: Monitor progress project dengan dropdown status

Advanced Features:

  • Scope Management: Repeater field untuk detail scope project
  • Technology Stack: Input teknologi yang digunakan
  • Custom Filtering: Integrasi dengan query blocks untuk filtering otomatis

Benefits untuk Tim PT Zumatic:

  • No Coding Required: Tim non-teknis dapat menambah project baru
  • Consistent Layout: Semua project menggunakan template yang sama
  • Easy Updates: Edit informasi project tanpa risiko merusak layout
  • Professional Presentation: Output yang selalu rapi dan profesional

3. Optimasi Plugin dan Performa

Plugin Optimization (20 → 15 plugins):

Plugins Dihapus/Diganti:

  • WPBakery Page Builder → GenerateBlocks Pro
  • Slider Revolution
  • Ajax Load More → Native WordPress functionality
  • Breadcumb NavXT
  • CL Testimonial
  • Beberapa plugin security redundant
  • Contact Form 7 → Everest Form

Plugins Baru yang Ditambahkan:

  • GenerateBlocks Pro
  • Asset CleanUp Pro
  • Slim SEO
  • Custom multilingual plugin by Harun Studio
  • SCF
  • WPS Hide Login
  • WP SVG Images
  • SmartSMTP

4. Performance Optimization

Kombinasi kuat antara tema GeneratePress dan GenerateBlocks sebenarnya sudah cepat, ringan dan responsif. Namun, untuk mencapai performa yang optimal, saya menerapkan berbagai teknik optimasi:

Advanced Speed Techniques:

  • Menggunakan CSS/JS yang diperlukan saja: Ini dengan bantuan plugin AssetClean Up
  • CSS/JS Optimization: Minifikasi dan kombinasi file
  • Image Optimization: Kompresi dan format WebP
  • Caching Strategy: Implementasi caching multi-level

Hasil dan Dampak Transformasi

Peningkatan Performa yang Signifikan

Skor PageSpeed Insights Setelah Optimasi:

MetrikBefore MobileAfter MobileBefore DesktopAfter DesktopPeningkatan
Performance53938110075.47% (Mobile)
Accessibility93100981007.53% (Mobile)
Best Practices96100961004.17%
SEO851008510017.65%

Browser Speed Test Results (After):

  • Requests: 122 → 64 (47.54% reduction)
  • Transferred: 3.1 MB → 4.8 MB (optimized content)
  • Resources: 7.0 MB → 5.2 MB (25.71% reduction)
  • Finish Time: 3.33s → 1.70s (48.95% faster)
  • DOMContentLoaded: 1.35s → 1.44s (maintained)

After Zumatic Performance

Dashboard Transformation

Salah satu aspek terpenting dari proyek ini adalah transformasi dashboard WordPress yang menjadi lebih user-friendly:

Before: Dashboard Kompleks Dashboard Before

Dashboard lama menampilkan banyak menu yang membingungkan, plugin yang tidak terorganisir, dan interface yang overwhelming untuk user non-teknis.

After: Dashboard Streamlined Dashboard After

Dashboard baru menampilkan:

  • Simplified Menu Structure: Hanya menu yang diperlukan
  • Custom Post Types: Project dan Insights terorganisir dengan baik
  • User-Friendly Labels: Terminologi yang mudah dipahami
  • Streamlined Workflow: Proses yang lebih efisien

Performance Metrics Visualization

Untuk memberikan gambaran yang jelas tentang improvement yang dicapai, berikut adalah visualisasi performa:

Before: Performance Metrics

After: Performance Metrics After

Grafik di atas menunjukkan pengurangan signifikan dalam jumlah HTTP requests dari 122 menjadi 64, yang berkontribusi pada peningkatan kecepatan loading website secara keseluruhan.

Project Pages Evolution

Transformasi halaman projects menunjukkan evolusi dari sistem yang kaku menjadi platform yang dinamis:

Before: Menggunakan Table dari NinjaTable Plugin Before Projects

Halaman projects lama menggunakan raw HTML tables sebelum saya bantu pindahkan atau migrasi ke plugin NinjaTable, yang tetap masih cukup sulit diedit oleh tim non-teknis.

After: Dynamic Project Management After Projects

Halaman projects baru menampilkan:

  • Dynamic Filtering: Filter berdasarkan industri dan teknologi
  • Responsive Grid Layout: Tampilan yang optimal di semua device
  • Easy Content Management: Tambah/edit project melalui dashboard
  • Professional Presentation: Layout yang konsisten dan menarik

Services Page Improvement

Halaman services juga mengalami transformasi signifikan:

Before: Basic Services Layout Before Services

After: Enhanced Services Presentation Before Services

Halaman services baru menampilkan informasi yang lebih terstruktur dengan visual yang menarik dan call-to-action yang jelas.

Transformasi User Experience

Kemudahan Pengelolaan Konten:

  1. Project Management: Dari raw HTML ke sistem ACF yang user-friendly
  2. Content Creation: Interface yang intuitif untuk semua jenis konten
  3. Multilingual: Sistem bahasa yang sederhana dan efektif
  4. Media Management: Organisasi aset yang lebih baik

Training dan Adoption:

Setelah implementasi, saya memberikan training komprehensif kepada tim PT Zumatic. Hasil training menunjukkan:

  • 95% Adoption Rate: Tim langsung dapat menggunakan sistem baru
  • Reduced Learning Curve: Waktu training berkurang dari 4 jam menjadi 1.5 jam
  • Self-Sufficiency: Tim dapat mengelola 90% kebutuhan konten mandiri

Feedback Klien

“Ini sudah sempurna! Proses pengelolaan menjadi sangat mudah. Meskipun masih butuh web developer untuk fungsi tertentu, untuk pengelolaan seperti menambahkan project baru, halaman baru, artikel/berita baru, semuanya sudah sangat mudah dan tidak terlalu teknis.”

— Tim PT Zumatic Saka Persada

Lessons Learned dan Best Practices

Key Success Factors

  1. Deep Understanding: Memahami workflow klien sebelum merancang solusi
  2. Gradual Implementation: Implementasi bertahap untuk meminimalkan disruption
  3. Custom Solutions: Mengembangkan solusi spesifik untuk kebutuhan unik
  4. User Training: Investasi dalam training untuk adoption yang sukses
  5. Performance Focus: Tidak mengorbankan performa untuk fitur

Technical Best Practices

  1. Plugin Minimalism: Hanya menggunakan plugin yang benar-benar diperlukan
  2. Custom Development: Mengembangkan solusi custom untuk kebutuhan spesifik
  3. Performance First: Setiap keputusan teknis mempertimbangkan dampak performa
  4. User-Centric Design: Mengutamakan kemudahan penggunaan dalam setiap interface
  5. Future-Proofing: Membangun sistem yang mudah dikembangkan di masa depan

Siap Mentransformasi Website Anda?

Proyek PT Zumatic Saka Persada membuktikan bahwa transformasi digital yang tepat dapat mengubah website dari beban menjadi aset yang powerful dan mudah dikelola.

Jika website Anda menghadapi tantangan serupa – performa lambat, sistem pengelolaan yang kompleks, atau kebutuhan custom yang spesifik – kami siap membantu merancang solusi yang tepat.

Layanan yang Tersedia:

Hubungi kami untuk konsultasi gratis dan temukan bagaimana kami dapat mentransformasi website Anda menjadi platform digital yang powerful dan user-friendly.

Measuring Success

Quantitative Metrics

Performance Improvements:

  • Mobile Performance: 75.47% increase (53 → 93)
  • Desktop Performance: 23.46% increase (81 → 100)
  • Page Load Time: 48.95% faster (3.33s → 1.70s)
  • Resource Optimization: 25.71% reduction (7.0MB → 5.2MB)

SEO Improvements:

  • SEO Score: 17.65% increase (85 → 100)
  • Core Web Vitals: All metrics in green zone
  • Accessibility: Perfect score (100/100)
  • Best Practices: Perfect score (100/100)

Qualitative Improvements

User Experience:

  • Simplified content management workflow
  • Reduced training time for new team members
  • Improved website maintenance efficiency
  • Enhanced brand representation online

Business Impact:

  • Reduced dependency on technical support
  • Faster content publishing workflow
  • Better user engagement metrics
  • Improved professional image

Proyek PT Zumatic Saka Persada bukan hanya tentang redesign website, tetapi tentang transformasi digital yang memungkinkan perusahaan untuk fokus pada core business mereka sambil memiliki platform digital yang powerful dan mudah dikelola.

Willya Randika

Willya Randika

Founder Harun Studio & web developer, blogger, serta hosting reviewer. Telah membantu pemilik bisnis meraih kesuksesan dengan design, development dan maintenance sejak 2021.

#redesign #wordpress #generatepress #generateblocks #optimasi #multilingual