PNM Digi Karyawan
All Employee Needs in One App
All Employee Needs in One App
This is my first project as a UI/UX designer and it's one of the biggest for our company. PNM Digi is an all-in-one app that meets almost all employee needs, from attendance records and leave permits to purchasing phone credits, data packages, and even cinema tickets. The main goal of this app is to digitize the employee culture and make it easier to fulfill their needs.
The attendance record feature is the main focus of my app. Previously, a biometric fingerprint presence machine caused long queues for entry and exit from the office.
This app eliminates those long queues. Users can open the app, scan a QR code and record their attendance in seconds from their smartphones. I researched similar apps such as Talenta and Hadirr and adapted their main flow while adding unique features.
The result is a new product that offers a better experience for attendance recording.
I had discussions with the related team and my head division, what features were prioritized and what was the desired flow. All the flows that I create start from the user registering, logging in, making attendance, entering passwords, and all the flows of features in it
I use the PNM logo colors of blue and green for the app's main color palette. The attendance recording menu, the main feature, is placed at the bottom of the screen with a larger size for easy access.
Other menu icons are a blue-green combination with a gradient circle design to match different shapes and colors, in case of third-party app integrations.
Meet Digiman! He's the representative character of PNMDigi Karyawan. Initially, I designed him as a superhero character with shades of blue, a blue mask, a big smile, and a red cape to illustrate the super capabilities of PNMDigi.
After finalizing the design, I made several illustrations to use in various formats such as status screens, notifications, posters, banners, and promotional ads.
Banners are a great way to communicate with users, but standardization is crucial for consistent UI design. I've created a guide for making banners that everyone posting an image banner in the app, including advertisers and internal/external parties, must follow. It covers banner size, file size, dominant color, font, and content.
First I made a hand sketch and then imported it into Photoshop.
Then it starts to be processed and animated through after effects and then exported to a gif animation.
And voila! a comical and friendly splash screen says hi when the user opens the app for the first time
Besides the attendance recording feature, there is much more that users can do in this application
WalletMakes it easy for users to view their balances, make transfers, and make payments and withdrawals.
Phone credits & InternetPurchase of prepaid and postpaid phone credit, as well as internet data packages.
Employee Digital ServicesA menu for making requests for permits, sick leave, leave, overtime, monthly employee attendance reports, and many more!
Actually... there are many more features that I haven't mentioned yet, and if I were to describe them in more detail, this page would become even longer. So, how about we schedule a longer chat to discuss how I came up with the design and flow of this app?
Demo app
Playstore
PNM Raih Digital Innovation Award 2022 dengan Inovasi Aplikasi PNMDigi Karyawan
source: okezone.com
