👋

Hello! I'm Gaddafi Rusli,
a digital product designer
and serial indie maker.

I'm currently leading a product design team in Kuala Lumpur, Malaysia. For the past 10 years, I was involved in designing digital products for several startups across various categories – from news network, rewards platform, mobile payment and many more.

Me

8Share

2014 UI UX Front-end Rails

8Share, used to be known as YouthSays, is a social reward platform for social media users. With users across South East Asia, the platform has been revamped multiple times since it’s inception in 2006. 8Share 2.0 is the biggest revamp effort by the product team to re-focus and re-align it’s mission to be the best reward platform in the region. I was primarily responsible in the full redesign of the website, as well as the front-end development of the Rails project.

8share main

Simplifying navigational elements

One of the main goals of the redesign is to simplify navigational elements on the platform. I managed to narrow down main functionalites of the platform and combined them into only a few main pages.

After considering several nagivational patterns, we’ve decided that having a fixed-position side navigation is the best and freshest approach for this project. Having the link to the main pages reachable at all time is the key to simplify navigation elements, as these pages will be constantly visited by the users every time they are on the site.


8share mocks 1

8share mocks 2

Bright colors, subtle roundness

8Share 2.0 design approach is primarily focusing on bringing out the fun and friendly side of the brand - especially with the selection of bright colors and subtle roundness on most of its interface elements - without trying too hard with excessive visual elements and gigantic graphics that can distract users from the main purposes of the site.


8share color

8share font 1

8share font 2

Color-coded components

The new design is also making use of color-coded components to help users to make the connection between the the features and content with the interfaces presented to them.

For instance, green-colored components are mostly associated with cash related featured (cash reward, cash out, etc). Blue-colored components are mostly associated with anything related to Bonus Points (BP).


8share reward

Easy access to rewards statistic

As a trustworthy reward platform, it is very important to have a transparent and quick way for the users to keep themselves updated with the rewards they've earned. In 8Share 2.0, we've introduced this new navigational element, called the "Stats Bar" - accessible on every page. It serves as a quick summary of their total rewards, as well as their recent activity.

8share stats 18share stats 28share stats 38share stats 4

All the stats in one place

While the Stats Bar is useful for a quick glimps of recent rewards, it is still crucial to have a dedicated dashboard page that gather all of the user's earnings, sharing history, and other statistic. Dashboard has been the most visited page in all the previous version of 8Share. So, we've improved this page further will much clearer messaging and related actionable items for the users.

8share dashboard
8share special show
8share landing