ui/ux design, ILLUSTRATION

PONGO STUDIOS WEBSITE

STORY

Pongo Studios is an independent video production company based in Penang, Malaysia. They produced high quality videos and known for their great storytelling. 

The problem they had was the lack of wow factor on their website that could drive away potential clients. It didn’t represent who they were as a business. 

They realized that their website has poor user experience where it was not responsive, didn’t have a distinct user flow and the user interface could do a better lift. They believe they could lose out-of-market share and might face reputational damage if this problem continues.

THE CHALLENGE

Icon NAwal

My challenge is to create a responsive website with a better user experience and user interface that highlight Pongo Studios’ services and showcase previous work for potential clients. 

The main goal is for potential clients to browse their portfolio and request for a quote via the website. 

 

USER-CENTERED DESIGN PROCESS

1

Research

I started tackling the challenge by researching the existing video production companies in Malaysia. These included Rising One Media and Buzzworks Films. Both website offered videography services with added on services.  

2

Concept

With inspiration from the research phase, I looked into the nature of both websites. Rising One Media opted for 1 site with anchored links whereas Buzzworks were more elaborate. From these two, I gained some insights into how Pongo Studios’ website should be laid out. A bit of both with minimal updates and uploads. 

3

Prototype & Usability Testing

The screen solutions were used to create a high-fidelity prototype. 

RESEARCH

Rising One Media

rising one media home page

1- The hero image used in this website on their landing page immediately  inform users the nature of their business. This is effective as users won’t be second guessing to what they do. 

2- The about me section seems a little bit cluttered with information. Although content is key, some organization using icons and grouped them better would be effective. 

rising one media web

3- The portfolio section looked organized with categories and labeling. However, the label with white background covers the images. 

4- A good section where testimonials from the past client were added in. Helps boost the credibility of the business.

5- The portfolio categories were organized. Highlighted categories will show the following videos accordingly, giving the users examples of what kind of videos were produced for any of the categories. 

6- Contact information were clearly written. Not using the contact form. Could be an added task for users to copy the information instead of a click of a button that brings the user to contact directly. 

Buzzworks Films

1- Users are welcomed with a contact form in lieu of a hero image. Could be confusing as to what services this company does. There’s a video attached where users must click to view. Would be better if the video plays by itself rather than depending on the user’s decision to click on the video.

2- Catchy color branding and bold fonts.

 

3- Videos in the portfolio section were organized. As you hover, the title and yellow box (part of the branding) will appear.

4- Vimeo was used to showcase the videos. I feel that this has a cleaner interface compared to YouTube. 

5- A short description accompanied by the client’s logo was useful to inform users about the project. Bit sized information was very effective.

buzzworks services

6- In their services section, some text that explains the nature of the service seemed very useful. It could potentially minimize the questions asked by clients with some pre reading on the type of services they offer. Users can have better understanding on the matter. 

7- The example videos that corresponds with the type of services Buzzwork Films offers. Very effective.

CONCEPT

User Flow

user flow

Wireframe

PROTOTYPE & USABILITY TESTING