White Label MEP

White Label MEP

Initiative owner

@Rizka Nugroho @Nurcahya Nania Anabela (Unlicensed) @Bintang Agung (Unlicensed)

UI/UX Researcher

@Nabilla Aqmarina Ariditya

UI/UX Designer

@Nabilla Aqmarina Ariditya

Priority

high

Epic

https://mceasy.atlassian.net/browse/DEVPROJECT-2752

Updated Details

  • 09/07/2023 → PRD Draft Created

Status

IN PROGRESS

Approval or Reviewed

[Project Lead] Rizka Nugroho
[Engineer Lead] William Eka
[UI/UX] Nabilla Aqmarina

Related Docs

Target Population

Target Description

Kebutuhan dari Telkomsel untuk menggunakan VSMS 2.0 dengan menampilkan logo dari branding telkomsel bukan McEasy sehingga mempermudah saat menjual ke end user mereka dengan branding Telkomsel dan enduser mereka dapat menggunakan VSMS 2.0 dengan branding Telkomsel

User Value

User Problem Definition

  • Bagaimana pengguna dapat mengubah dan/atau memodifikasi label yang dimiliki oleh software Mceasy ini menjadi milik Telkomsel IOT?

  • Bagaimana pengguna dapat menggunakan sistem McEasy tanpa iklan/pelabelan apa pun dari McEasy?

  • Bagaimana cara pengguna menentukan dan memilih alamat kantor pusat dan/atau kantor operasional mereka sendiri?

User Problem Frequency

  • Pengguna ingin permintaan ini diproses sesuai dengan requirement dan standard yang telah disepakati

User Problem Severity

  • Karena permintaan ini diminta segera untuk digunakan oleh Telkomsel IOT dalam kegiatan operasional perusahaan.

Proposed solution

  • Menambahkan fitur baru “setting management” yang dapat digunakan untuk kebutuhan sebagai berikut:

    • Untuk beberapa logo dan image pada MEP dapat dilakukan replacement menggunakan image dari Telkomsel dan Domain menggunakan yang digunakan.

    • Theme colour pada website MEP dapat disesuaikan dengan branding perusahaan, meliputi warna pada button, warna font, warna wizard, dan card.

    • Pengguna dapat menentukan font family sesuai dengan standard font yang telah disediakan atau dapat mengupload font sesuai dengan branding perusahaan.

Description & Flow

Mockup & Design

https://www.figma.com/proto/k345KvZUkLAKlBTRbwfv45/VSMS-2.0_1?type=design&node-id=2546-134454&t=5kqtGJqk7aml7DNe-1&scaling=scale-down&page-id=0%3A1&starting-point-node-id=2546%3A134454&mode=design

Success Criteria

  • Permintaan ini dianggap berhasil jika VSMS McEasy akan didesain ulang sesuai permintaan pelanggan.

Constraints & Limitation

  • Fitur ini hanya akan dikembangkan pada sistem McEasy VSMS, dengan perubahan logo dan gambar latar belakang dilakukan di sisi pengaturan yang dapat diubah sendiri oleh pelanggan.

  • Setting asset management hanya muncul di parent saja, nantinya child akan mengikuti settingan parent.

Supporting Documents

List Content White Label MEP:

Whitelable MEP .xlsx

User Stories

User Story

Importance

Mockup

Details

Subtask breakdowns

User Story

Importance

Mockup

Details

Subtask breakdowns

1

Content Management

2

As a User, I want login on MEP white label will remove identity of McEasy

must have

 

Brief

Feature dapat replace image yang ada pada system MEP sehingga dapat menampilkan identitas/branding dari customer yang menggunakan whitelabel


User flow

Buka MEP


Expected results

  1. Domain whitelabel mengarah ke DB Sub Domain MEP yang sudah diset

  2. Pada table content terdapat Remove, Change, atau Change/Remove,


    berikut detailnya

    1. Change : Jika ada link gambar pada DB maka menampilkan gambar tersebut apabila di DB kosong maka menampilkan default image dari system

    2. Change/Remove : Jika ada link gambar pada DB maka menampilkan gambar tersebut apabila di DB kosong maka tidak perlu ditampilkan di MEP

    3. Remove : Dihilangkan dari system

  3. White label untuk child akan mengikuti image dari parent tidak perlu mendaftar sendiri

https://mceasy.atlassian.net/browse/DEVPROJECT-2798

3

As a User I want to customize the theme colour UI display in the VSMS therefore it is useful to indicate that company branding colour

must have

 

Brief

  • Terkait dengan permintaan kebutuhan pelanggan, maka semua colour standard ME saat ini akan dapat di customize sesuai dengan branding perusahaan yang menggunakan whitelabel MEP.

  • Perubahan dilakukan pada VSMS 2.0 atau MEP sehingga pengerjaan diharapkan dapat memwhitelabelkan semua UI di MEP.


User flow

Tidak ada yang dilakukan pengguna pada sistem karena semuanya diatur oleh tim McEasy Engineer.


Expected results

  • Dapat mengatur perubahan tema content pada tampilan website MEP sesuai dengan kebutuhan customer.

  • Saat ini terdapat dua standard warna pada MEP, meliputi:

    • Primary Colour → memiliki 5 turunan

    • Secondary Colour → memiliki 5 turunan

  • Diharapkan nantinya semua content dengan warna primary dan secondary colour dapat menyesuaikan warna custom yang disetting.

  • Setting hanya akan mengatur warna utama (opacity 100%), nantinya warna turunan akan menyesuaikan berdasarkan oppacitynya.

  • Berikut list-list content yang dapat dicustomize dengan standard warna dan turunannya, nantinya saat memilih warna primary dan secondary maka content-content dengan warna turunan akan mengikuti sesuai dengan opacity (turunannya).

  • Nantinya Ketika melakukan customize warna content, jika pada button terdapat font colour atau icon, maka warnanya dapat menyesuaikan dengan kondisi:

    • Ketika warna customize pada button yang full fill colour cenderung gelap (Hue value gelap) maka font yang ada pada button akan otomatis menjadi warna putih.

    • Ketika warna customize pada button yang full fill colour cenderung terang (Hue value terang) maka font yang ada pada button akan otomatis menjadi warna hitam.

    • Jika warna button hanya di border button, maka warna font pada button akan mengikuti warna border buttonnya.


Related module

All Modules


Translation Copy

Any bilingual docs


https://mceasy.atlassian.net/browse/DEVPROJECT-2799

4

As a User I want to customize the font colour UI display in the VSMS therefore it is useful to indicate that company branding colour

must have

 

Brief

  • Perubahan warna font pada general text (Title dan Subtitle) yang dapat dicustomize.

  • Perubahan warna font pada content button, card yang dapat menyesuaikan warna dasar button.


User flow

Tidak ada yang dilakukan pengguna pada sistem karena semuanya diatur oleh tim McEasy Engineer.


Expected results

Terdapat dua grouping untuk menentukan warna pada content, meliputi:

  • General Text

    • Customize warna untuk Title dan subtitle pada semua text di MEP website.

    • warna subtitle akan mengikuti turunan dari warna title utama.
      berikut merupakan warna standard untuk general text yang digunakan oleh ME saat ini:

    • Setting warna hanya ada 1 pallet, nantinya untuk turunan akan otomatis menyesuaikan warna opacity utama.


Related module

All Modules


Translation Copy

Any bilingual docs


https://mceasy.atlassian.net/browse/DEVPROJECT-2800

5

As a User I want to customize the font family type UI display in the VSMS therefore it is useful to indicate that company branding colour

must have

 

Brief

  • Penyesuaian font family sesuai dengan branding perusahaan


User flow

Tidak ada yang dilakukan pengguna pada sistem karena semuanya diatur oleh tim McEasy Engineer.


Expected results

  • Saat ini standart font family yang digunakan di sistem MEP milik Mc Easy adalah “Gotham Pro

  • Nantinya dapat mengatur font family disesuaikan dengan font family yang direquest user dan diatur pada DB.

  • Penerapan font family hanya diterapkan ke domain user yang request saja.

  • Penerapan font family akan mengaruh ke semua font yang ada di sistem MEP.


Related module

All Modules


Translation Copy

Any bilingual docs


 

6

As a User I want to customize the subject Email, body email and signature while send verification code and scheduler report.

must have

Display Email Send For Kode Verifikasi Standard ME
Display Email Send For schedular Report Standard ME

 

Brief

  • Dari sisi backend dapat mengcustomise body email untuk send verification code dan schedular report untuk mengganti identitas mc easy.


User flow

Tidak ada yang dilakukan pengguna pada sistem karena semuanya diatur oleh tim McEasy Engineer.


Expected results

Email Verification Code
Display Email Send For Kode Verifikasi Standard ME
  • Subject Kode Verifikasi [VSMS Mc Easy]

    • VSMS Mc Easy dapat direplace dengan value dari Nama Aplikasi jika terisi.

  • Logo mc Easy (Dihilangkan)

  • Logo Linked in dan Instagram. (Dihilangkan)

  • Informasi Mobile number, Phone Number, Email (Dihilangkan)

  • Informasi Head Office dan Operational Office (Dihilangkan)

  • Website url (Dihilangkan)

  • Footer Banner

    • Jika ada link gambar pada DB untuk footer banner ada maka menampilkan gambar tersebut, apabila di DB kosong maka menampilkan default image dari system.

Email Report Schedular
  • Body Email “Kepada Pengguna [VSMS],

    • VSMS Mc Easy dapat direplace dengan value dari Nama Aplikasi jika terisi.

  • Logo mc Easy (Dihilangkan)

  • Logo Linked in dan Instagram. (Dihilangkan)

  • Footer Banner

    • Jika ada link gambar pada DB untuk footer banner ada maka menampilkan gambar tersebut, apabila di DB kosong maka menampilkan default image dari system.


Related module

All Modules


Translation Copy

Any bilingual docs


https://mceasy.atlassian.net/browse/DEVPROJECT-2802

7

As a Mc Easy teams wants to change the sidebar models

must have

https://www.figma.com/proto/HJEOnrJk5ugiL3SLcNrJFs/DS-ME---Web?page-id=9315%3A10695&type=design&node-id=10255-54288&viewport=-858%2C-86%2C0.27&t=WBFIdHwPL60J06Ru-1&scaling=scale-down&starting-point-node-id=10255%3A54288&show-proto-sidebar=1&mode=design

Brief

  • Merubah tampilan sidebar untuk MEP Website / VSMS 2.0 menjadi basic putih.


User flow

Tidak ada yang dilakukan pengguna pada sistem karena semuanya diatur oleh tim McEasy Engineer.


Expected results

  • Side menu bar akan menjadi warna default putih dan hanya hover yang akan disesuaikan dengan warna primary.

  • tampilan sidebar minimum dan maksimum dan logo yang digunakan disesuaikan dengan design figma

  • Menu akan digrouping sesuai dengan design figma.


Related module

All Modules


Translation Copy

Any bilingual docs


DEVPROJECT-2801

8

As a Mc Easy teams wants to change the sidebar models

must have

https://www.figma.com/proto/HJEOnrJk5ugiL3SLcNrJFs/DS-ME---Web?page-id=9315%3A10695&type=design&node-id=10255-54288&viewport=-858%2C-86%2C0.27&t=WBFIdHwPL60J06Ru-1&scaling=scale-down&starting-point-node-id=10255%3A54288&show-proto-sidebar=1&mode=design

Brief

  • Merubah tampilan sidebar untuk MEP Website / VSMS 2.0 dengan memanagement (grouping).


User flow

Login > Sidebar


Expected results

  • Pada side menu akan terdapat menu (Group - Sub Group) dengan hirarki sebagai berikut:

    • Group 1

      • Sub Group 1

      • Sub Group 2

      • Sub Group n+1…

         

    • Jika dalam satu group, user melakukan subscripe di >= 1 sub-menu maka menu yang tampil pada sidebar:

      • Group 1

        • Sub Group 1

      • Group 2

        • Sub Group 1

        • Sub Group 2

Next Phase

  • Jika dalam satu group, user hanya melakukan subscripe terhadap 1 sub-group saja maka yang ditampilkan adalah langsung sub groupnya (tanpa menampilkan Group).

    • Contoh → pada Group Manajemen Pengiriman user hanya melakukan subscripe ke menu Order. Maka yang akan tampil diside bar adalah menu Order (tanpa dibungkus oleh Group).

 


Related module

All Modules


Translation Copy

Any bilingual docs


https://mceasy.atlassian.net/browse/DEVPROJECT-2899

9

As a User, I want manage end user (domain-subdomain) when they used MEP white label from McEasy

must have

 

Brief

Membuat hirarki untuk Whitelabel untuk parent dan child


User flow

Login Parent Whitelabel → Domain Control → List Company


Expected results

  1. Menu Setting “Management Asset” untuk whitelabel hanya diberikan kepada parent, sehingga penerapan customisasi whitelabel pada child (sub-domain) akan meneysuaikan dari parent-nya.

  2. User yang memiliki Hak Akses untuk mendapatkan setting “Asset Management” pada level administrator.

https://mceasy.atlassian.net/browse/DEVPROJECT-2851

10

As a user Whitelable I need all the Illustration Image without Mc Easy Branding

must have

 

Brief

Menghilangkan branding Mc Easy untuk ilustrasi whitelabel.


User flow

Disetting pada backend


Expected results

  • Semua ilustrasi untuk MEP whitelabel menggunakan ilustrasi tanpa branding Mc Easy.

https://mceasy.atlassian.net/browse/DEVPROJECT-2852

11

Asset Management

12

As a user I need customize colour setting to remove identity of McEasy

must have

https://www.figma.com/proto/hwxiDnyOQPRRbwCEAMhXLL/Whitelabel?type=design&node-id=562-32445&t=Jtlqx0NFYtX3cGcK-1&scaling=min-zoom&page-id=0%3A1&starting-point-node-id=562%3A32445&show-proto-sidebar=1

 

Brief

  • Terdapat Fitur untuk mengatur warna tema content pada menu setting untuk memwhitelabelkan warna tampilan sesuai dengan branding perusahaan.

  • Pada menu personalia terdapat setting warna untuk mengatur warna content di MEP website dan VSMS apps sesuai dengan kebutuhan perusahaan customer.


User flow

Login VSMS 2.0 → Setting → Personalisasi → warna


Expected results

Personalia > Warna > Warna Brand
  • Utama

    • Customize Primary Colour pada setiap content di MEP dan VSMS Apps.

      • ketika user mengklik palet warna primary, maka akan muncul pallet yang dapat diatur oleh user untuk disesuaikan.

    • Semua turunan warna primary akan diset melalui preset “Utama”

    • Hex Number

      • Memberikan informasi hex number sesuai dengan warna yang dipilih.

      • Mode disable (just display).

    • Dapat dilakukan atur ulang → kembali ke default warna ME

  • Sekunder

    • Customize Secondary Colour pada setiap content di MEP dan VSMS Apps.

      • ketika user mengklik palet warna primary, maka akan muncul pallet yang dapat diatur oleh user untuk disesuaikan.

    • Semua turunan warna primary akan diset melalui preset “Sekunder”

    • Hex Number

      • Memberikan informasi hex number sesuai dengan warna yang dipilih.

      • Mode disable (just display).

    • Dapat dilakukan atur ulang → kembali ke default warna ME

Personalia > Warna > Warna Teks

Warna teks digunakan untuk melakukan setting terhadap warna teks general (Title/subtitle) dan juga Teks Link (Teks yang dapat mendirect ke another page).

Warna Teks
  • Teks General

    • Mengatur warna keseluruhan teks pada MEP dan VSMS Apps.

    • Semua turunan akan menyesuaikan berdasarkan warna teks general.

    • Hex Number

      • Memberikan informasi hex number sesuai dengan warna yang dipilih.

      • Mode disable (just display).

    • Dapat dilakukan atur ulang → kembali ke default warna ME

CTA

  • Atur Ulang

    • Mengembalikan setting-an sesuai dengan default Mc Easy

  • Toggle

    • Melakukan enable / disable content

      • Disable → menonaktifkan fitur tampilan

      • Enable → mengaktifkan fitur tampilan

  • Kembali

    • Kembali kehalaman sebelumnya

  • Terapkan

    • Untuk menyimpan dan menerapkan perubahan yang dilakukan.


Related module

All Modules


Translation Copy

Any bilingual docs


https://mceasy.atlassian.net/browse/DEVPROJECT-2809

13

As a user I need customize colour setting for font models based on company branding

 

https://www.figma.com/proto/hwxiDnyOQPRRbwCEAMhXLL/Whitelabel?type=design&node-id=562-28783&t=Jtlqx0NFYtX3cGcK-1&scaling=min-zoom&page-id=0%3A1&starting-point-node-id=562%3A28783&show-proto-sidebar=1&mode=design

 

Brief

  • Terdapat Fitur Asset Management pada menu setting untuk menyesuaikan tipe font pada judul, sub judul, tulisan content sesuai dengan branding perusahaan.

  • Pada menu personalia terdapat setting font untuk mempermudah user menentukan model tulisan sesuai dengan kebutuhan perusahaan customer.

  • Pengaturan ini akan diterapkan di MEP website dan VSMS apps


User flow

Login VSMS 2.0 → Setting → Personalisasi → Font


Expected results

Setting → Personalia → Font
  • Default

    • Setting sesuai dengan default font Mc Easy → Gotham Pro

  • Font

    • Menyediakan list-list font yang dapat digunakan user.

    • hasil upload font yang diupload sesuai dengan domain user akan masuk kedalam list font.
      Note: List font setiap domain berbeda sesuai dengan request upload font via backend.

CTA

  • Kembali

    • Kembali kehalaman sebelumnya

  • Terapkan

    • Untuk menyimpan dan menerapkan perubahan yang dilakukan.


Related module

All Modules


Translation Copy

Any bilingual docs


https://mceasy.atlassian.net/browse/DEVPROJECT-2810

14

As a user I need change all the Mc Easy logo with the user company’s logo

 

https://www.figma.com/proto/hwxiDnyOQPRRbwCEAMhXLL/Whitelabel?type=design&node-id=562-28783&t=Jtlqx0NFYtX3cGcK-1&scaling=min-zoom&page-id=0%3A1&starting-point-node-id=562%3A28783&show-proto-sidebar=1&mode=design

Setting Logo

 

Brief

  • Terdapat Fitur Asset Management pada menu setting untuk merubah logo-logo Mc Easy menjadi logo perusahaan user.

  • Pada menu personalia terdapat setting logo untuk mempermudah user melakukan upload gambar sesuai dengan kebutuhan perusahaan customer.

  • Semua logo yang terupload akan diterapkan pada MEP website dan VSMS Apps.


User flow

Login VSMS 2.0 → Setting → Personalisasi → Logo


Expected results

Tab > Logo
  • Logo Utama

  • Maksimal

    • Logo perusahaan yang dicustom akan diterapkan ke MEP website dan VSMS Apps.

    • Logo perusahaan maksimal diterapkan pada semua logo besar Mc Easy:

      • Halaman login page,

      • Halaman Lupa password & Verification Code

      • Side bar Maksimal

    • Logo perusahaan yang diupload akan mereplace content pada bagian:

      • Halaman Login → diatas Masuk ke Akun

    • Set Default

      • Setting semua logo perusahaan dengan logo Mc Easy

    • Custom

      • User dapat melakukan upload logo perusahaan dengan maksimum file size 2 MB.

      • Format picture yang dapat di upload adalah .JPG, .JPEG atau .PNG.

      • Success Criteria): Jika proses upload foto berhasil maka user akan menerima pemberitahuan [Image Successfully Upload].

      • (Failed Criteria): Jika proses upload foto berhasil maka user akan menerima pemberitahuan [Image Failed Upload - "Reason"]

        • [Reason:]

          1. The image exceeds the predefined size limit.

          2. The image does not match the predefined format.

      • Setiap file foto yang berhasil di rubah maka akan otomatis ter-apply pada lokasi (tanpa menggunakan trigger button terapkan.

  • Minimal

    • Logo perusahaan yang dicustom akan diterapkan ke MEP website dan VSMS Apps.

    • Logo perusahaan maksimal diterapkan pada semua logo besar Mc Easy:

      • Sidebar Minimal

    • Logo perusahaan yang diupload akan mereplace content pada bagian:

      • Halaman Login → diatas Masuk ke Akun

    • Set Default

      • Setting semua logo perusahaan dengan logo Mc Easy

    • Custom

      • User dapat melakukan upload logo perusahaan dengan maksimum file size 2 MB.

      • Format picture yang dapat di upload adalah .JPG, .JPEG atau .PNG.

      • Success Criteria): Jika proses upload foto berhasil maka user akan menerima pemberitahuan [Image Successfully Upload].

      • (Failed Criteria): Jika proses upload foto berhasil maka user akan menerima pemberitahuan [Image Failed Upload - "Reason"]

        • [Reason:]

          1. The image exceeds the predefined size limit.

          2. The image does not match the predefined format.

      • Setiap file foto yang berhasil di rubah maka akan otomatis ter-apply pada lokasi (tanpa menggunakan trigger button terapkan.

  • Logo Copyright

    • Logo Copyright yang dicustom akan diterapkan ke MEP website dan VSMS Apps.

    • Logo Copyright yang diupload akan mereplace content pada bagian:

      • Halaman Login → powered by Mc Easy

    • Set Default

      • Setting semua logo perusahaan dengan logo Mc Easy

    • Custom

      • User dapat melakukan upload logo perusahaan dengan maksimum file size 2 MB.

      • Format picture yang dapat di upload adalah JPG, .JPEG atau .PNG.

      • Success Criteria): Jika proses upload foto berhasil maka user akan menerima pemberitahuan [Image Successfully Upload].

      • (Failed Criteria): Jika proses upload foto berhasil maka user akan menerima pemberitahuan [Image Failed Upload - "Reason"]

        • [Reason:]

          1. The image exceeds the predefined size limit.

          2. The image does not match the predefined format.

    • Terdapat toggle switch active/innactive

      • active → menonaktifkan tampilan powered by [Mc Easy]

      • Innactive → menonaktifkan tampilan powered by [Mc Easy] sehingga pada halaman tidak akan muncul.

    • Setiap file foto yang berhasil di rubah maka akan otomatis ter-apply pada lokasi (tanpa menggunakan trigger button terapkan.

  • Logo Tab Browser (Favicon)

    • Custom

      • User dapat melakukan upload logo perusahaan dengan maksimum file size 2 MB.

      • Format picture yang dapat di upload adalah JPG, .JPEG atau .PNG.

      • Success Criteria): Jika proses upload foto berhasil maka user akan menerima pemberitahuan [Image Successfully Upload].

      • (Failed Criteria): Jika proses upload foto berhasil maka user akan menerima pemberitahuan [Image Failed Upload - "Reason"]

        • [Reason:]

          1. The image exceeds the predefined size limit.

          2. The image does not match the predefined format.

    • Nama Tab Browser

      • Tampil untuk mereplace informasi tab browser [Mc Easy - VSMS 2.0]

      • Panjang karakter maksimal 15 karakter

    • Setiap file foto yang berhasil di rubah maka akan otomatis ter-apply pada lokasi (tanpa menggunakan trigger button terapkan.

  • Animasi Loading - Mobile

    • Diterapkan untuk loading animation di VSMS Apps

    • Custom

      • User dapat melakukan upload logo perusahaan dengan maksimum file size 2 MB.

      • Format picture yang dapat di upload adalah JPG, .JPEG .PNG atau .GIF

      • Success Criteria): Jika proses upload foto berhasil maka user akan menerima pemberitahuan [Image Successfully Upload].

      • (Failed Criteria): Jika proses upload foto berhasil maka user akan menerima pemberitahuan [Image Failed Upload - "Reason"]

        • [Reason:]

          1. The image exceeds the predefined size limit.

          2. The image does not match the predefined format.

    • Setiap file foto yang berhasil di rubah maka akan otomatis ter-apply pada lokasi (tanpa menggunakan trigger button terapkan.

CTA

  • Toggle

    • Terdapat toogle active-innactive

      • Innactive → menonaktifkan fitur tampilan

      • Active → mengaktifkan fitur tampilan

  • Kembali

    • Kembali kehalaman sebelumnya

  • Terapkan

    • Untuk menyimpan dan menerapkan perubahan yang dilakukan.


Related module

All Modules


Translation Copy

Any bilingual docs


https://mceasy.atlassian.net/browse/DEVPROJECT-2815

15

As a user I need change all the Mc Easy Adds and banners with the user company’s for re-branding.

 

https://www.figma.com/proto/hwxiDnyOQPRRbwCEAMhXLL/Whitelabel?type=design&node-id=658-15228&t=pt3KgMDbT3SLwUSQ-1&scaling=scale-down&page-id=0%3A1&starting-point-node-id=562%3A32445

Setting Banner

 

Brief

  • Terdapat Fitur Asset Management pada menu setting untuk menyesuaikan adds dan banner.

  • Adds dan banner dapat di hide jika user tidak ingin menampilkan

  • Pengaturan ini akan diterapkan di MEP website dan VSMS apps


User flow

Login VSMS 2.0 → Setting → Personalisasi → Banner


Expected results

Setting → Personalia → Banner
  • Banner Login

    • User dapat melakukan upload gambar untuk merubah tampilan banner disamping login username dan password pada halaman login.

    • User dapat melakukan upload logo perusahaan dengan maksimum file size 2 MB.

      • Format picture yang dapat di upload adalah JPG, .JPEG atau .PNG.

      • Success Criteria): Jika proses upload foto berhasil maka user akan menerima pemberitahuan [Image Successfully Upload].

      • (Failed Criteria): Jika proses upload foto gagal maka user akan menerima pemberitahuan [Image Failed Upload - "Reason"]

        • [Reason:]

          • The image exceeds the predefined size limit.

          • The image does not match the predefined format.

    • Field CTA Link (O)

      • Digunakan untuk memasukkan link yang digunakan untuk mendirect banner ke halaman lain.

      • Jika tidak diisi, maka tidak dapat mendirect ke halaman manapun

      • button terapkan → untuk mengaktifkan url CTA Link

    • Setiap file foto yang berhasil di rubah maka akan otomatis ter-apply pada lokasi (tanpa menggunakan trigger button terapkan.

  • Banner Pop Up

    • Terdapat toogle active-innactive

      • Innactive → menonaktifkan fitur tampilan

      • Active → mengaktifkan fitur tampilan

    • User dapat melakukan upload gambar untuk merubah tampilan banner yang muncul pada pop up dihalaman login

    • User dapat melakukan upload logo perusahaan dengan maksimum file size 2 MB.

      • Format picture yang dapat di upload adalah JPG, .JPEG atau .PNG.

      • Success Criteria): Jika proses upload foto berhasil maka user akan menerima pemberitahuan [Image Successfully Upload].

      • (Failed Criteria): Jika proses upload foto gagal maka user akan menerima pemberitahuan [Image Failed Upload - "Reason"]

        • [Reason:]

          • The image exceeds the predefined size limit.

          • The image does not match the predefined format.

    • Field CTA Link (O)

      • Digunakan untuk memasukkan link yang digunakan untuk mendirect banner ke halaman lain.

      • Jika tidak diisi, maka tidak dapat mendirect ke halaman manapun

      • button terapkan → untuk mengaktifkan url CTA Link

    • Setiap file foto yang berhasil di rubah maka akan otomatis ter-apply pada lokasi (tanpa menggunakan trigger button terapkan.

  • Banner Sidebar

  • Terdapat toogle active-innactive

    • Innactive → menonaktifkan fitur tampilan

    • Active → mengaktifkan fitur tampilan

  • Maksimal

    • User dapat melakukan upload gambar untuk merubah tampilan banner atau adds pada bottom sidebar saat di expansi.

    • User dapat melakukan upload logo perusahaan dengan maksimum file size 2 MB.

      • Format picture yang dapat di upload adalah JPG, .JPEG atau .PNG.

      • Success Criteria): Jika proses upload foto berhasil maka user akan menerima pemberitahuan [Image Successfully Upload].

      • (Failed Criteria): Jika proses upload foto gagal maka user akan menerima pemberitahuan [Image Failed Upload - "Reason"]

        • [Reason:]

        • The image exceeds the predefined size limit.

        • The image does not match the predefined format.

      • Banner clickable → jika di klik akan menampilkan banner pop up iklan

    • Setiap file foto yang berhasil di rubah maka akan otomatis ter-apply pada lokasi (tanpa menggunakan trigger button terapkan.

  • Minimal

    • User dapat melakukan upload gambar untuk merubah tampilan banner atau adds pada bottom sidebar saat di collapse.

    • User dapat melakukan upload logo perusahaan dengan maksimum file size 2 MB.

      • Format picture yang dapat di upload adalah JPG, .JPEG atau .PNG.

      • Success Criteria): Jika proses upload foto berhasil maka user akan menerima pemberitahuan [Image Successfully Upload].

      • (Failed Criteria): Jika proses upload foto gagal maka user akan menerima pemberitahuan [Image Failed Upload - "Reason"]

        • [Reason:]

        • The image exceeds the predefined size limit.

        • The image does not match the predefined format.

      • Banner clickable → jika di klik akan menampilkan banner pop up

    • Setiap file foto yang berhasil di rubah maka akan otomatis ter-apply pada lokasi (tanpa menggunakan trigger button terapkan.

  • Banner Beranda Mobile

    • Ditampilkan pada beranda di VSMS Apps.

    • User dapat melakukan upload gambar untuk merubah tampilan banner footer di body email

    • User dapat melakukan upload logo perusahaan dengan maksimum file size 2 MB.

      • Format picture yang dapat di upload adalah JPG, .JPEG atau .PNG.

      • Success Criteria): Jika proses upload foto berhasil maka user akan menerima pemberitahuan [Image Successfully Upload].

      • (Failed Criteria): Jika proses upload foto gagal maka user akan menerima pemberitahuan [Image Failed Upload - "Reason"]

        • [Reason:]

          • The image exceeds the predefined size limit.

          • The image does not match the predefined format.

    • Field CTA Link (O)

      • Digunakan untuk memasukkan link yang digunakan untuk mendirect banner ke halaman lain.

      • Jika tidak diisi, maka tidak dapat mendirect ke halaman manapun

      • button terapkan → untuk mengaktifkan url CTA Link

    • Setiap file foto yang berhasil di rubah maka akan otomatis ter-apply pada lokasi (tanpa menggunakan trigger button terapkan.

  • Banner Email

    • Terdapat toogle active-innactive

      • Innactive → menonaktifkan fitur tampilan

      • Active → mengaktifkan fitur tampilan

    • User dapat melakukan upload gambar untuk merubah tampilan banner footer di body email

    • User dapat melakukan upload logo perusahaan dengan maksimum file size 2 MB.

      • Format picture yang dapat di upload adalah JPG, .JPEG atau .PNG.

      • Success Criteria): Jika proses upload foto berhasil maka user akan menerima pemberitahuan [Image Successfully Upload].

      • (Failed Criteria): Jika proses upload foto gagal maka user akan menerima pemberitahuan [Image Failed Upload - "Reason"]

        • [Reason:]

          • The image exceeds the predefined size limit.

          • The image does not match the predefined format.

    • Field CTA Link (O)

      • Digunakan untuk memasukkan link yang digunakan untuk mendirect banner ke halaman lain.

      • Jika tidak diisi, maka tidak dapat mendirect ke halaman manapun

      • button terapkan → untuk mengaktifkan url CTA Link

    • Setiap file foto yang berhasil di rubah maka akan otomatis ter-apply pada lokasi (tanpa menggunakan trigger button terapkan.

CTA

  • Terapkan

    • Untuk menyimpan dan menerapkan perubahan yang dilakukan.

  • Toggle

    • Melakukan active-innactive content

      • Innactive → menonaktifkan fitur tampilan

      • Active → mengaktifkan fitur tampilan

  • Kembali

    • Kembali kehalaman sebelumnya


Related module

All Modules


Translation Copy

Any bilingual docs


https://mceasy.atlassian.net/browse/DEVPROJECT-2816

16

As a user I need change all the Mc Easy companys profile with the user company’s for re-branding.

 

https://www.figma.com/proto/hwxiDnyOQPRRbwCEAMhXLL/Whitelabel?type=design&node-id=667-19557&t=pt3KgMDbT3SLwUSQ-1&scaling=scale-down&page-id=0%3A1&starting-point-node-id=562%3A32445&show-proto-sidebar=1

Brief

  • Terdapat Fitur Asset Management pada menu setting untuk menyesuaikan kontak profil perusahaan.

  • Pengaturan ini akan diterapkan di MEP website dan VSMS apps


User flow

Login VSMS 2.0 → Setting → Manajemen Aset → Kontak Perusahaan


Expected results

Kontak Perusahaan → Kantor Pusat
  • Nama Perusahaan (M)

    • Free Text → diisi nama perusahaan

    • Diimplementasikan salah satunya untuk body email (mereplace kata-kata “Mc Easy”

  • Alamat (O)

    • Free Text → diisi alamat utama perusahaan

    • Jika pada setting tidak diisi (null) maka di tampilan Menu akan tampil “ - “

    • Diimplementasikan untuk “Head Office” alamat di menu Kontak Kami.

  • No. Telepon Kantor (O)

    • Free Text → diisi nomor telepon kantor perusahaan

    • Jika pada setting tidak diisi (null) maka di tampilan Menu akan tampil “ - “

    • Diimplementasikan untuk “Telepon Head Office” alamat di menu Kontak Kami.

  • No. Telepon HP. (O)

    • Free Text → diisi nomor telepon HP perusahaan

    • Jika pada setting tidak diisi (null) maka di tampilan Menu akan tampil “ - “

    • Diimplementasikan untuk “Handphone Head Office” alamat di menu Kontak Kami.

Kontak Perusahaan → Kantor Operasional
  • Alamat (O)

    • Free Text → diisi alamat utama perusahaan

    • Jika pada setting tidak diisi (null) maka di tampilan Menu akan tampil “ - “

    • Diimplementasikan untuk “Operational Office” alamat di menu Kontak Kami.

       

  • No. Telepon HP. (O)

    • Free Text → diisi nomor telepon HP perusahaan

    • Jika pada setting tidak diisi (null) maka di tampilan Menu akan tampil “ - “

    • Diimplementasikan untuk “Handphone Operational Office” alamat di menu Kontak Kami.

Kontak Perusahaan → Media Sosial
  • Facebook (O)

    • Terdapat toggle untuk active innactive

      • Aktif → menampilkan logo

      • Innactive → Menyembunyikan logo

    • URL → jika logo di klik akan direct ke halaman URL

  • Instagram

    • Terdapat toggle untuk active innactive

      • Aktif → menampilkan logo

      • Innactive → Menyembunyikan logo

    • URL → jika logo di klik akan direct ke halaman URL

  • Linked In

    • Terdapat toggle untuk active innactive

      • Aktif → menampilkan logo

      • Innactive → Menyembunyikan logo

    • URL → jika logo di klik akan direct ke halaman URL

  • Youtube

    • Terdapat toggle untuk active innactive

      • Aktif → menampilkan logo

      • Innactive → Menyembunyikan logo

    • URL → jika logo di klik akan direct ke halaman URL

  • Whatsapp

    • Terdapat toggle untuk active innactive

      • Aktif → menampilkan logo

      • Innactive → Menyembunyikan logo

    • URL → jika logo di klik akan direct ke halaman URL

CTA Button

  • Terapkan

    • Menerapkan hasil update yang diinputkan

    • akan aktif ketika ada perubahan dari field di dalam setting Kontak Perusahaan

  • Kembali

    • Kembali ke halaman Management Aset

    • Jika terdapat update dan user tidak meng-klik terapkan kemudian kembali, maka hasil perubahan tidak akan diterapkan.


Related module

Kontak Kami


Translation Copy

Any bilingual docs


https://mceasy.atlassian.net/browse/DEVPROJECT-2817

17

As a User, I want manage end user when they used MEP white label from McEasy

MUST HAVE

 

Brief

Membuat hirarki untuk Whitelabel untuk parent dan child


User flow

Login Parent White Label → Domain Control → List Company


Expected results

  1. Menu ini hanya tampil untuk parent dari whitelabel

  2. Menu List company merupakan table yang berisi

    1. Company Name → Nama company / anak perusahaan

    2. Domain Child → Domain child anak perusahaan yang terdaftar

    3. Total Fleet → menampilkan total fleet (dengan status Aktif) dari sub domain.

    4. Total Driver → menampilkan total driver (dengan status Aktif) dari sub domain.

    5. Button Login (Auto Login) → ke sub-domain yang dituju

https://mceasy.atlassian.net/browse/DEVPROJECT-2851

18

As a User, I want register device to McEasy so we will keep track our GPS on McEasty platform

(Next Sprint)

 

 

Brief

Registrasi device ke system VSMS V1 berdasarkan domain whitelabel telkomsel

User flow

Login Parent White Label → Domain Control → Register Device

Expected results

  1. Menu ini hanya tampil untuk parent dari whitelabel

  2. Terdapat form untuk add imei yang dapat dituju ke domain parent atau child dari while label

  3. Imei yang diregister akan masuk ke database VSMS 1 dan sesuai odoo_id dari domain tersebut (Tidak auto add ke tracker TMS)

  4. Register Device

    1. Drop down gps type mengikuti yang ada pada server

    2. INSERT INTO imei_table(date_time, imei, gps_type, port_server)

    3. port_server perlu validasi dari ENG apa masih perlu atau tidak

    4. setelah sukses mengirim perlu online command berikut 7000,GC,IMEI,TARGET,3

  5. Set to Customer

    1. Pastikan muncul dropdown aktif saat checkbox diklik

    2. Dropdown akan muncul pada field GPS Type dan Domain

    3. Drop down gps type mengikuti yang ada pada server

    4. Drop down domain akan muncul sesuai domain parent + child yang terdaftar di

    5. Saat save perlu kirim UPDATE imei_table set lsms_id='odoo_id', gps_type='id_type' WHERE imei=''

  6. Untuk masuk ke TMS masih perlu manual add dari customer sendiri (Flow as is TMS - VSMS)


https://mceasy.atlassian.net/browse/DEVPROJECT-2866

19

VSMS APP

20

As a User, I want to explore system on vsms app without McEasy indentity, so that I can know that the app from whitelabel

must have p0

 

Brief

  • Terdapat beberapa logo dan banner yang telah ditetapkan pada sistem MEP yang akan pengganti tampilan pada aplikasi, antara lain :

    • logo besar

    • mini icon

    • icon aplikasi

    • company name

    • banner


User flow

Tidak ada yang dilakukan pengguna pada sistem karena semuanya telah ditetapkan pada MEP.


Expected results

In Scope

  • View sheet

Out of Scope

  • Nama Aplikasi

  • Icon Aplikasi


Related module

All Modules

 

21

As a User, I want to explore system on vsms app with my company branding colour, so that I feel more satisfying

must have p0

 

Brief

  • Terdapat 4 warna yang telah ditetapkan pada sistem MEP yang akan berpengaruh pada pewarnaan di aplikasi, antara lain :

    • warna utama → perubahan pada warna card, tombol. etc

    • warna sekunder → perubahan pada warna card, tombol. etc

    • warna teks general → perubahan pada Judul, Sub Judul, dan teks biasa

    • warna teks link → perubahan pada text url atau link yang clickable


User flow

Tidak ada yang dilakukan pengguna pada sistem karena semuanya telah ditetapkan pada MEP.


Expected results

Terdapat konten yang menggunakan warna utama, antara lain :

  • View sheet

Terdapat konten yang menggunakan warna sekunder, antara lain :

  • View sheet

Terdapat dua grouping untuk menentukan warna pada content, meliputi:

  • General Text

    • Customize warna untuk Title dan subtitle.

    • warna subtitle akan mengikuti turunan dari warna title utama.
      berikut merupakan warna standard untuk general text yang digunakan oleh ME saat ini:

  • Text Link

    • Customize warna untuk semua text yang clickable / dapat direct ke another page.


Related module

All Modules


 

22

As a User, I want to view ‘Kontak Kami’ page become customable, so that I can view valid company data that defined in MEP

must have p0

 

Brief

dari fitur ini user dapat melihat halaman ‘kontak kami’ yang telah diatur pada MEP, sehingga user dapat mengetahui identitas asli perusahaan yang melakukan whitelabel


User flow

login → profil → kontak kami


Expected results

  • Alamat Kantor Pusat

  • No. Telepon Kantor Pusat

  • HP Kantor Pusat

  • Alamat Kantor Operasional

  • No. Telepon Kantor Operasional

Sosial Media

  • Facebook

  • instagram

  • linkedin

  • youtube

  • whatsapp


Related module

Help

 

23

As a Admin, I want to manage ‘Ulasan’ page become customable, so that I can get the feedback from user

must have p1

 

 

  • link form

  • link paystore

24

As a User, I want to get email notification when forgot password, so that I can reset my password for login to the system

must have p1