Rypl – mildly nsfw

Cam4 is an adult platform, to connect performers and an audience. I worked on various projects, like SMS Verification, inbox, payment platform, notifications and more.

While the site is NSWF the content you see here is fairly cleaned up and kept in mind for portfolio pieces. 

My roles varied from project to project.

I took on many diverse and challenging projects, and go into high level detail about each.

Included are SMS Verification, payment platforms, inboxing and other challenging versatile projects!

 

2 Factor Authentication

Over View

Security is very important, especially for performers who have token balances. The idea was to test this first with registered performers and then move into bringing it to everyone.

Role

Research, end to end user flow, mock ups, internal peer to peer testing and review

Duration

1 Month

Problem

Performers need a way to better protect their account, tokens and feel more secure

Objective

Provide a security measure that high level brands are using

Solution

Implement a security system that prevents people from logging in with out using the 2 Factor 

Research and Competitive Evaluation

Looking at google and twitter, to get an idea of flow, triggers and feedback. Gaining insight and questions.

Pain Points

  • I don’t feel my account is secure enough
  • I can’t remember my answer to my security question
  • What if my token balance isnt safe?

Defining the Users

  • Wishes to better protect their account/tokens
  • Wants a more secure account
  • Can I trust a site that doesn’t have these measures?

General inquires About 2FA

  • What is the time out session?
  • Do we let them know about the time out session?
  • Do we allow to delete, edit or both?
  • How many attempts?
  • What if they lose their phone?
  • If they are deleting their phone number should they provide a password as well?
  • What else triggers 2FA? Different I.P. Addresses?
  • Could there be a time lapse between the trigger and receiving the 4 digit code?

See the SMS Verification in action

Measuring Success

Testing end to end flow

That all triggers work properly

Engineers were able to execute from the design/flows provided

What Did I Learn?

Not all performers have smart phones

Some only still have landlines or email access

There could be delays between the trigger and receiving the code


24/7 Cams

Over View

This project would allow an Fan Club Member to view a performers day to day life. They could view 2-8 Cams with in the house. They could select 1 view, 2 Views or 4 Views. They could also choose from a list view, a video view or choose from the map indicators. The cams also had a motion detector automatically set up, in which a viewer then could choose to go and look at that room.

Role

Research other sources of live cams, brainstorm ideas, wireframes, final look and feel, interactive prototypes and peer to peer reviews

Duration

1.5 Months

Problem

  • As a user I want to maintain a constant connection with my favourite performer
  • As a business we want to increase revenue and maintain retention

Objective

Create more interest in performers, gain revenue and retention with a unique idea that not many cam sites are doing.

  • Design for non Fan Club Members, Non Fan Club Members, offline rooms, when a live show is on, vacation mode, full screen mode
  • Grid View, List View, Map View
  • 1, 2, 4, and full screen view
  • Automatic motion detector

Solution

24/7 cams allows members to maintain their connection, while seeing what the lives of performers are like beyond their shows

Research and Competitive Evaluation

Voyeur Villa

  • Proximity seems to be everywhere, video is on one side and the map is on the other
  • Icons and text for the map are small, as well as toggles seem to disappear into the background
  • There’s just a lot going on for this page to navigate the rooms and locations
  • Indicator for chosen room could be a bit stronger

Reallifecam

  • Actionable items do not look clickable (what about mobile!?)
  • Room indicator is ok – the pale yellow might be an issue on different monitors
  • The screen toggles need a bit more breathing room
  • Text heavy with it would be nice to have visuals (grid view), how and why are they in that order?
  • Sound icon for an active room – does that mean theres only sound?

 

Pain Points

  • I don’t feel connected enough with my favourite performer
  • I wish I knew what their day to day lives were like?
  • What is their life like beyond their shows?

Defining the Users

  • Is emotionally invested in the performer
  • Wishes to know more about performers lives
  • Is dedicated to the performer

Wireframing, testing and iterations

First ideation was to have the interactive side on the right, similar to how youtube works. After peer to peer discussions, looking at ux patterns ( F Pattern ) this would change to the left being the first thing they see.

Testing inquires

  • Is it clear what room a user is on?
  • Do users know that the map is interactive as well?
  • While changing a room, would they remember what room they were on previously?
  • Is it clear how many rooms there are they can view?

 

Another iteration was to have a user be able to change the room by clicking with in the video area. This was too confusing as now there would be a grid, list, map and video to dictate the interaction.

The Final Solution/Prototype

  • Consolidate all interactions into a grouping on the left
  • Be aware of cognitive overload (1,2,4 and full view kept separate)
  • Make the map look more clickable and clear which room they are on
  • Stronger use of icons indicating the room they are on
  • Used edit icon as appears more actionable
  • Number of rooms located now at the top
  • Removed option to change room from the video area
  • F pattern for faster readability, groupings of items in relation
  • When changing a room an indicator of what room they are changing is on

The Full Project

A interaction with 24/7 Cams

Measuring Success

Peer to peer feedback provided insight into icons

Grouping elements worked effectively and reduced confusion and cognitive overload

Having an indicator when in selection mode helped users remember what room they are on

Dimming non selected rooms made it also clear what room was changing

What Did I Learn?

To be able to design on a complex level for a product that has many variables

Interestingly enough the icon problem was solved during the high fidelity phase

To keep in mind designing for over 17 languages


Super Tip Overlays Ideations

 

Check out all the ideas for Super Tip Overlays

Over View

A fun and interesting way to get members to engage more and increase revenue

Before

Role

Created various designs and interactions

Duration

1 Month

Problem

As a business how can we better engage members and performers, how can we keep the website fun and still bring in revenue?

Objective

Be more visually effective, less cognitive overload, have element stand out more

Solution

Move beat the leader or other concepts making it more prominent and a central focus

Pain Points

  • (Performer) I want to earn more tips through the members when doing a show
  • (Member) There’s so much to look at I feel overwhelmed
  • (Business) We want to increase revenue and keep members engaged

Defining the Users

  • (Performer) Wishes to earn more tokens
  • (Member) Wishes to have different methods of sending tokens
  • (Member) Likes engaging and interesting ways to send tokens

General inquires and Research

  • How can I make it more apparent and interesting?
  • Will the icons/visuals be apparent?
  • Is that the best spot for it? Are there others?

Measuring Success

Peer to peer feedback provided insight about icons and location

What Did I Learn?

Play around with all kinds of designs

Refer back to the problem to make the best possible solution


Payment Platform

View Payment Platform – Full Ideas, Mobile, Fresh take on tables

Over View

Performers can select their payments, set up payments and cash our payments.

Role

Collaborated with Product Manager and Accounting team

Made ux and ui improvements on current design – See Below or see the rest

Duration

1.5 Months

Problem

Performers need a way to better way to understand their payment methods, what’s on reserve, available and the method to cash out

Objective

To help performers better understand the payment system

Solution

Make total funds, reserve, available funds, easier to understand. Clean up the ux and the ui

Research and Competitive Evaluation

Looking at banking and their solutions

Connecting with Accounting team for adding in new cards, feedback overlays,

Pain Points

  • I don’t know how much I can actually cash out
  • I wish the information was presented better
  • I want to be able to cash out a custom amount

Defining the Users

  • Wishes information was simplified
  • Wants to easily cash out
  • Wants to know their account balance

Key Insights from the Account Team

Give a confirmation overlay to prevent any errors

A performers information must be verified

If they are being mailed a new card there is a waiting period

Measuring Success

Testing end to end flow

That all triggers work properly

Engineers were able to execute from the design/flows provided

What Did I Learn?

Not all performers have smart phones

Some only still have landlines or email access

There could be delays between the trigger and receiving the code


Inbox

Over View

The inbox allows members to communicate, stay connected, send pics, tips and gifts.

Role

Research into how to prevent fraudulent tips. Looking into up to date methods for quick replies and overall look and feel.

Duration

2 Weeks

Problem

Inbox is outdated and isn’t secure enough

Objective

To prevent fraudulent tips, give a cleaner design, add in new functionalities

Solution

No longer allow users to bold text and say they have sent tips. Encapsulate tip area/amount in a way that it can not be reproduced

Research and Competitive Evaluation

Looked into similar functions such as gmail and quick auto reply

Pain Points

  • Fraudulent tips cause a lot of headache
  • Sometimes I just don’t have time to message people back
  • I can’t trust a site that that doesn’t have measures in place
  • If I get a tip I dont want to have to check my balance each time

Defining the Users

  • Wants to know they have real tips
  • Wants a way to quickly respond to messages in the inbox
  • Wants to know the company to takes preventative measures

General inquires About Inbox

  • Is there a way to make sure tips can not be replicated
  • What quick replies should be provided?

Measuring Success, Testing and Final Design Product

Screenshot and uploading new design method to see if it could be replicated, which it could not

New layout is cleaner and more modern

What Did I Learn?

To be creative in thinking about

See the whole inbox, including mobile!


Notifications

Over View

Create a home for notifications so Members can easily find them or don’t miss them. Currently they only show up in the header and disappear after being seen.

Role

Research and design

Duration

1 Month

Problem

Important notifications are getting lost (disappears after being seen)

A better way to let members know about updates and features

Objective

Provide a home for notifications so members always have access to them and important details like features, promotions token balances, and updates.

Solution

Created a permanent home for notifications

Research and Competitive Evaluation

Found facebook to be the most intuitive and similar in nature

Pain Points

  • I cant remember the new feature/update that came out, or now where to find it
  • I cant keep track of all the different notifications (features, friend requests, promotions)
  • I get annoyed that after seeing the notification it disappears forever

Defining the Users

  • Wants to have a centralized location for such alerts
  • Wants to reduce time having to look for updates/promotions/etc
  • Wishes the alerts just didn’t disappear after being seen

General inquires About Notifications

  • How similar to facebook should it be, what do they do right?
  • How far back can they go?
  • What should be included?

Measuring Success

Allows users to have a central area

Design is easy to understand

What Did I Learn?

There are so many variables depending what type of user you are within the website

 

 


Performer Profile/Galleries/Fan Club/My Shop

OverView

Performers can sell their content, videos, upload to the fan club gallery, add to a free gallery. Members than use tokens to make purchases. The view of this would be from an audience/member view.

Role

Re-design

Duration

1 Month

Problem

  • Ux/UI not strong enough, everything is on the same level
  • Redundancy: Two ways to access My Shop. Two ways to access fan club
  • Hierarchy issues
  • Grouping issues
  • Cognitive overload issues
  • Items that are clickable have no call to action

Objective

Provide a stronger design to gain revenue and modernize the look and feel

Solution

See all the ideas for the profile

  • Moved Fan Club so it’s position is stronger. Added in when it was last updated
  • Moved My Shop (another source of revenue if a performer has content)
  • Added in when the next show is 
  • Moved call to action for Fan Club WITH the actual content (ux grouping best practice)

Design Decisions and why

Used best practices: groupings, hierarchy, less cognitive overload

Pain Points

  • I don’t know when the last update on the fan club is, I dont want to join or pay a recurring fee with out that information
  • Everything looks the same
  • There’s too much on the page I don’t know what to do first or next
  • There’s no call to action on the Fan Club Image, do I click that to join? What happens?

Defining the Users

  • Wants to know about Fan Club Updates
  • Wishes for less cognitive overload
  • Wants to easily find what they are looking for
  • Wants clickable items to to have a call to action/clearer indication

Measuring Success

Means of revenue are a lot stronger

Stronger groupings and calls to action related to that content

What Did I Learn?

The importance of hierarchy, grouping, cognitive overload

 

 

The Calendar

Problem: Mostly outdated look.

 

 

 

Performer pre-broadcast window

Problem:

Too much information all at once.

Solution: Break it down into a digestible two step process

Limitations: Some research on OBS

 

The Solution:

A two step process that allows a performer to digest the information easier

 

Performer Broadcast window

Problem: Mostly outdated design elements

Limitations: Will users understand the new design elements?

Solution: Provide context to the icons

After Private Show

Problem: Design needs a refresh!

 

Settings Viewer Side Live Performance

The goal of this was just to do minor changes, add in modern flavour and simplify the design.

 

 

 

Friends and Favourites

Problem:

Outdated look and feel and some usability

View with lots of Friends and favourites

A way to search

A way to mass delete