Introducing Soundboard Station

The ultimate platform for selling sound drops.

Stand out from other content creators with a new type of content and merch offering.

Works beautifully on mobile phones.
Works beautifully on desktop computers.

What is Soundboard Station?

Soundboard Station is a website where you can play, create, share, buy, and sell soundboards.

Why should I use Soundboard Station?

Unique way to merchandise your signature sounds
Add production value to your livestream
Collaborate with your live production team
Have fun, and make your friends laugh

What pricing models can I use to sell soundboards?

One time payments
Subscriptions
Donations

Features

Edit Soundboards like a Spreadsheet
Undo/redo changes
Edit button colors, and flash speeds
Trim and add gain to audio clips
Edit Multiple Permissions Simultaneously
For soundboards, audio clips, studios, groups, and more
Assign permissions to users, or to groups of users
Manage several different permission levels
View/filter/edit all permissions for all audio clips on a given soundboard in 1 place
Manage Access Groups
Configure WHAT the group can access
Audio Clips
Soundboards
Studios (work in progress)
Editor members manually
Allow members to join
For a 1 time payment
With a paid subscription
For a custom donation
By request/approval
For free (click to join)
Studios
Windows-like GUI with soundboard panels
Plays to all users in Studio Room
Chat Panel with filters, sorting, and more...
Rando Handles for new visitors to quick and easily chat or drop
Automatic Session Scheduling
PowerChats (work in progress)
  • User selects donation amount
PowerDrops (work in progress)
  • Preset price for each soundboard in Studio

Episode 1: High Level Walk-Through

Join us in this video for an orientation to Soundboard Station.

In this video, we will introduce you to the various areas of the site.

Topics covered:

  • Navigation and Layout
  • Information Pages
  • Production Areas
  • Administrative Areas

Episode 2: Creating a User

Join us in this video as we walk through the process of creating your user at Soundboard Station.

We cover all the mental prep work and what to expect, so you don't have to figure it out all on your own.

Topics covered:

Episode 3: Creating a Soundboard

Coming soon...

Up to Bat

Currently being worked on at Soundboard Station

Soundboard Button Settings Modal

Re-organize settings groups:
Audio
Gain Override
Show default gain
  • Make it apparent that this does not change gain for clip everywhere
Add link to Audio Clip Edit Page from button settings modal
Add play rate
Appearance
Button text
Color editors
Behavior
Button Response
  • Click to play, click to pause
  • Click to play, click to restart
Loop Audio (or, should this be on the audio tab??)
Update the context menu options, and editor states
Change "Set" to "Button settings"
Change "Color" to "Color and Flash"
Load ONLY Appearance section
Hide button text (only show color editors)
Show again next time
Remove Dimensions
Change "Play Settings" to "Behavior"
Load ONLY Behavior section

Permission Editor

If Public Permission is soft deleted, show the add public permission button
On click, revive the existing soft-deleted public permission

How-To Video Series - Episodes 1 - 4

Episode 01: Orientation
Increase the audio level
Animate the fart board story
Episode 02: Creating a User
Fix spelling error on title/recap screens - missing d in Soundboard
Fix audio levels at the the end
Change title of "next episode"
Episode 03: Creating a Soundboard
Uploading Audio Clips
Public Permission
Button Grid Editor
Undo/Redo
Public Permission
Episode 04: Permissions
Pending changes, multiple submissions
Public, Personal, Groups
Levels - Viewing Details
Uniqueness, soft-deletion, and revival
Associated File Permissions

Join Method Editor

Add links in Join Methods Editor
Join Page
Members Page
Access Requests
Preview Join/Members pages?
Add Messages for Selecting Payout Recipient
Add dismissable warning about how to select themselves as the payout recipient
Add dismissable warning with link to onboarding page if they are not already onboarded
If they select anyone OTHER THAN THEMSELVES, show ANOTHER dismissable warning that they have selected someone else
If they select themselves correctly, show a dismissable success message saying that they have selected themselves
Add My Memberships Page to Security Diagram
Add links to soundboard Access Page
On Soundboard Editor page
On Access Groups page
Preview Access page?
Add Studios to Accessibles?

How-To Video Series - Episodes 5 - 9

Episode 05: Access Groups
Accessible Soundboards and Files
Modifying Access Groups FROM the Soundboard Edit Page
Permissions - DIFFERENT THAN MEMBERSHIP!
Memberships
Manually adding member
Removing Member
Join Methods
  • Free
  • One Time Payment
  • Donation
  • Subscription
  • Access Request
Payout Recipients
Demo Free Join Method
Episode 06: Access Requests
Approving
Denying
Episode 07: Getting Paid
Stripe On-boarding
Creating a paid join method
Episode 08: Adding Payment Methods
Episode 09: Episode Managing Memberships

Studios

Chat

ExitStudioSessionChat
Call on disconnect
RandoPasswordChange

Studio Feed Page

Create the page
Restrict access to users with "Host" permission
Test all feed outputs in Streamlabs

PowerChats

  • Logged in users only
SubmitStudioSessionPowerChatMessage
Allow user to set price
Process payment
Save payment record
Add PowerChatImage to Studio model
Render on feed page when payment successful
Render message on feed page
Somewhere inside the image?
Add PowerChatAudioClip to Studio model
Play on feed page when payment successful

PowerDrops

  • Logged in users only
Play immediately, or mimick the PowerChat UI for consistency?
If the former, perhaps establish a "Power drop session" first?
  • would serve as an object to store the "cancellation" window
  • needed to prevent accidental PowerChat/PowerDrop orders
SubmitStudioSessionPowerDrop
CancelStudioSessionPowerDrop
Play PowerDrop audio file on Feed page
Render PowerDrop image to Feed page when PowerDrop is sent

Backstage Chat

Render backstage studio chat for users with backstage permissions
Load last 1000 messages for backstage studio chat
Add way to load MORE messages further back

Rendering Lifecycles

Change room neon status sign when session state changes
Force render the "Outside" layout
When session ends
If user no longer permitted inside room

Host Features

Add toggle switch at top of each for hosts to unplug/plug in soundboards
Save true/false iPI (is plugged in)
Use signalR to notify studio audience of soundboard unplugging
If no active session, AND user can host, show button to start an impromptu session
Pop-up modal to confirm
Allow user to specify end time (or not)

Moderator Features

Allow Mods to have "Manager" access to modifying timeline permissions
  • Instead of CanEditPermissions, CanEdit[Session/Backstage]TimelinePermissions

Studio Session Scheduling

Allow cancelling individual sessions

High Priority Bugs

Audio Clips Index Page

SHIFTS the nav buttons in the nav bar on load
  • Bootstrap-table-ism?
  • Or is it the loading spinner
Can not sort by different columns on mobile
  • Bootstrap-table-ism...

Studio Editor

Figure out better way to gracefully handle the validation error:

"Not authorized to set the soundboard asdondoinasd in studios"
because this prevents the user from being able to change anything at all

Bugs with editors when user is Editor, but not Manager
Test when editing a studio without Manager permission
Test when editing a studio without Scheduler permission
Check soundboard, file, and group edit pages as well
When user removes their own Manager permission, and submits while on the permission tab, it tries to load the permission tab and fails
Require users with timeline permission to have the appropriate studio permission (enter while in session)
Do not require users to have permissions to edit a given soundboard when editing a studio that has that soundboard
Do not allow non-studio-owners to change soundboard payout recipients

Android

[SB.Studios.Index] - Action buttons are not rendering when doors open - but they do un-render when doors close
[SB.Edit.ContextMenu] - Opening context menu does not close existing context menu
[SB.Studios.Room] - Site footer not rendering in correct location when dragging chat panel below it

Bench Warmers

How-To Video Series - Episode 10

Episode 10: Studios
Creating
Scheduling
Chat/Drop Features
Chat Permissions

Scheduled Session Auto-Generation

Create manual process for generating missing scheduled sessions
Add button on Studio Edit Page to run this?
Should only run for a given Studio IF someone tried to enter the studio within the given day window
Design process to generate missing scheduled sessions
Should only run once a day
Build cron-job infrastructure???

File Uploading

Prevent IFormFiles from clearing on Audio Clip Upload page
  • VERY ANNOYING ISSUE...
  • Affects Audio Clip upload page
  • Affects Studio Soundboard Create/Edit pages (PowerDrop images)

Soundboard Editor/Player Upgrades

Push behaviors
Push when already playing behaviors
Pause
Stop
StopAndPlayFromBegining
PlayAdditionalFromBeginning
Open Waveform in Interactive Mode (click to play)
Show/Do Not Show Waveform on Play
Allow start on push start
Allow push + hold to play

Profile settings

Bio
Profile permission editor
Implement security filter for FindPeople controller method to restrict access accordingly
Profile Picture
Emcee pages
Link routing - copy logic from soundboards

Audio Engineering

Modifications - Only at Audio Clip Level
Trim
Gain
Fix when only playing in 1 speaker
Envelope (fade in/out)
Play Settings
Audio Clip Default
Soundboard Button Settings
Play-time Settings
Play Page
Studio Rooms
Sound Modifiers (similar editor as color modifiers)
[pitch|speed|pitch+speed|echo|distortion] |------------------|---------------|

Move Button(s)

Add "Move Button(s)" menu item to Selection Context Menu
  • When single button selected
  • Also when multiple buttons selected
Create a special "Move Button(s)" state for the editor
Visually indicate that the editor is in a special state
Implement dragging and dropping of the button(s) to new location
Prevent drop if target cell(s) already have audio clips assigned

Copy/Paste Style

  • Try to copy spreadsheet copy/paste behavior
    • Single button, easy => single style to all targets
    • Multiple buttons, HARD => map styles to target range of buttons (many edge cases... implement in subsequent stage/phase?)
Add Copy Style menu item to Selection Context Menu
Add Copy Style button next to Undo/Redo buttons
  • possibly easier for mobile

Bugs/Housekeeping

General Bugs/Testing

Bug(s) exist with permission editor undo/redo state controller
Access Group Accessibles Undo/Redo also broken
Test All Feature Limitation Groups
BUG: If Max Audio Clip Count == 12, they can really only upload 11...
Associated file permission editor does not set OriginatingSoundboardPermission if that soundboard permission is not also being set
Consider removing this property entirely...
Join method editor - when row marked for deletion, on POST fail reload, the deletion is undone
When navigating back and forth to the Access Group page "Alex's Group", the Join Method join code gets set with the Join Method name
Fix roundness of "What" column input groups in accessibles editor

UI Improvements

Warn users when they save permissions without any flags set
  • Perhaps, give permission summary?
  • Make it WAY more clear when something is public, vs not public
Implement persistence and undo/redo for about tab
auto-generate soundboard link from name when editing the name
don't generate link if link has been edited manually
Display an asterisk when there are pending changes on each tab
Display asterisk at root/page level if ANY tab has pending changes
Disable save button if no changes exist
[LOW-HANGING-FRUIT] Filter AFPE when new SB permission is added - to the who Person or Group that was added
Allow RowFocusHandlers to handle when clicking on "what"
Replace toaster notifications with the dismissable alert
Add dismissable alert when there is a validation error
Add "Clear local changes" button
  • In case the user WANTS to clear the changes,
  • OR in case the editor(s) get into a broken state
Add icons/flatten buttons in Soundboard Editor when Audio Clip not found, or not permitted
Add icons/flatten buttons in Soundboard Editor Button Model preview when Audio Clip not found, or not permitted
Render Permissions in Better Order:
Public Permissions First
Then, Group Permissions
PUT ALL MEMBERSHIP PERMISSIONS IMMEDIATELY AFTER IT'S PARENT GROUP (tricky....)
Lastly, Personal Permissions
When neither Listed, nor Join Code is selected, disable the Price Type
Space out join methods with a divider on small screen
Button to toggle showing deleted join methods
Deleting Join Method not being tracked by undo/redo state controller
Bug: associated file permission editor is not handling membership permission properly
  • It allows creating personal permissions, despite the person not having a personal permission for the soundboard (they have a membership permission)

IOS 8

[LOW PRIORITY], [IOS8], [SB.Edit] - input element type=color not supported
[LOW PRIORITY], [IOS8], [SB.Player] - Too much space between button rows

Backlog

Audio Clip Uploading

Add Play Settings Editor to Audio Clip Upload Page
Would need separate everything for each file...
Display list of supported formats on upload page
Prevent uploader from selecting files of different type?
Allow recording from microphone
Allow recording device audio
Allow uploading/recording in Soundboard Editor button settings modal

Soundboards/Audio Clips Pages

Likes
Comments
Display prices of join methods on index pages

Payment Method Creation

[OPTIONAL]

Style inputs with the proper background colors, border colors, and focus shadow
Host the domain verification for Apple Pay @ soundboardstation.com/.well-known/apple-developer-merchantid-domain-association

Join Method Validations

Only validate access code uniqueness for non-deleted join methods
Update the validation checks
Update the database unique constraint

Permission Editor Improvements

Group File Accessibles do not appear in associated file permission editor, but the membership permissions do
  • Workaround: add a soundboard permission for the group, or modify on the audio clip edit page
Add a "select all" toggler button above each permission column
Place this in the same row as the filters?
  • Problem: this may be confusing to mix filters and "select all" functionality in the same row
  • Also, mobile devices don't have columns
Move "Show Deleted Rows" to top right corner to make space for this
Audio clip permission changes do not appear to be clearing from local storage on upload submission
  • is the authoring session being cleared properly?
  • Maybe, this is actually a good thing

Studio Room Layouts

Evaluate implementation of Undo/Redo
Save Layout button
On click, launch save layout modal
Modal Title: "Saving Layout"
Layout Name input
Is Default
Is Default for screen size
  • verify UI on phone when changing orientation
List all saved layouts
On click, render that layout

Timepicker

  • Current js library sucks completely
  • A new, simple, custom component should be made
  1. It should use Popper
  2. It should render a select element on phones
  3. It should also accept text input from keyboard
    • on desktop
    • and phones
  4. It should default to :00 and :30 times
  5. Decide on using separate dropdown/select for hours, minutes, and am/pm...
    • May be better than scrolling through from 12:00 AM all the way to 11:30 PM...

Button Previews

Implement hover colors and transition
  • set via mousein/out?
  • or with hover in CSS?
  • or debounced global mouse move event?
Implement pressed in colors and transition
Implement selection colors and transition
Make selection color relative to the set color
Handle button text overflow
  • Make button grow indefinitely?
  • Or truncate text with elipses?

Undo/Redo

Add undo/redo buttons for mobile devices
Add asterisk in modal when changes detected
Implement Ctrl+Shift+Z for redo
Truncate the undo/redo stack if they get too large?
When undoing fast, modal might not be properly open or close
handle when a modal change happens out of order

Dimensions Section

(Min|Max) Width|Height
Push Height
Roundness
Border Width

Deletion Logic Upgrades

When deleting group, remove all membership permissions
When deleting soundboard, remove all membership permissions
When deleting audio file, remove all membership permissions
Show associated file permissions on delete and perma-delete pages
Prevent files from being deleted OR hard deleted when they are used in soundboards
Evaluate whether to track this via strict database tracking
Perhaps, keep a many-many relationship table between files and soundboards...
Add new "Used on" tab on file edit page to display soundboards the file is used on

Access Groups Index Page

Show 2 separate tables
One for groups that the user is a member of
Another for groups that the user is an admin of
Admin is not able to edit all groups
Or add accessibles to them on other editor pages for that matter

Group Lifecycles

Implement reviving groups
Implement perma-deleting groups

My Subscriptions page

Show the price and period for each subscription
Add link/button to nav to group members page
Show membership status
Add button to re-activate membership if inactive

My Payments page

Outgoing vs. incoming?
Show the price and recurrence of each payment
Show group name, and nav to group members page
Add refund button
Show membership status
Add button to re-activate membership if inactive

Group Payments page

Show the price and recurrence of each payment
Add refund button
Show membership status

Refund Process

New model/table to store refund requests
Refund request index page for admins to view requests
Approve Page
Call payment processor API to execute refund
Deny Page

Access Requests

Show failed access request history
Send request email with link to approval page

Admin Upgrades

Allow admins to filter index page by whether to show deleted soundboards
Check-button styles not loading on user roles page

Notifications

Allow user to subscribe to notifications for studio

  • Schedule changes
  • Show starting
    • in 5 minutes
    • in 15 minutes
    • in 1 hour

Job running service

"every other Tuesday" is NOT supported by cron
- Would need secondary evaluation to determine this...
- Also, should check if existing session is cancelled

Help Tooltips and Messages

Make single, global, toggleable setting, like the theme setting, for help/info tooltips
Add help tooltips to Join Method editor