Slot Machine 4

Stop Making Boring Webpages

Slot Machine ensures that your webpages don't have the same exact content every time the page loads. This makes the site more exciting and keeps visitors engaged. The random content is chosen on the server. This means that only the data for content chosen will be downloaded by the browser. This is makes browsing your site much faster since only the content needed gets downloaded.

Key Features

Demo

Slot Machine

The below demo is a simple 3 column stack with a Slot Machine stack in each column. If you were to refresh the page, you would see the content randomly change to something different.

While this demo is only shuffling between images, Slot Machine can randomly pick content with entire layouts with multiple stacks inside.

Slot Machine ensures that your webpages don't have the same exact content every time the page loads. This makes the site more exciting and keeps users engaged.

Stacks Image 1015
Stacks Image 1029
Stacks Image 1055

Randomize

The Randomize stack does not show/hide content. Instead it allows you to shuffle content that is already on the page. The shuffling of items on the page can happen on page load and also with the click of a button, link, or any other stack that you want.

Randomize has integrations with many your favorite stacks so that you can easily randomize their content such as Horizon, Total CMS, Foundation, Video Wall and more.

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10

Random Image

The Random Image stack allows you to randomly display one of more images from a folder of images on your server. It can display the images on your webpage in the order order that they are stored on your server (alphabetical), or it can randomly shuffle them. It keeps track of the images already added to the page so that you will not get duplicates until all images have been used.

Random Image from Slot Machine Stack
Random Image from Slot Machine Stack
Random Image from Slot Machine Stack

Particle Generator

The Particle Generator can take any layout build with stacks and replicate it any number of times. However, who wants the same exact content over and over again. You can add particle data into your content to add variety.

Say Hello to 5 Friends

In this first example, the name at the end of each header is randomly injected from a list of possibilities that I provide. This is a simple example to get you to better understand what Particle Generator is doing.

The following data is passed to the generator in order to create the headers:

Scott,Davide,Chris,Bret,Brian,Andrew,Paul,Gary,Brent,Wolf,Josh,Jacob,Jessica,Fran

Hello Wolf!

Hello Scott!

Hello Brian!

Hello Fran!

Hello Gary!

50 Randomly Generated Boxes

In this second example, we are creating 50 boxes that are of a random size and color. In order to accomplish this we are using 2 particle data points that are added to the class of each box. These classes control the size and background color of the boxes using Foundation swatches or CSS.

Fun with Drift

Let's have some fun. We can use Particle Generator with Drift Pro (sold separately) to animate all of the boxes that we just created.

Prototyping

Let's say that you are prototyping a webpage. You would like to create a grid of 15 items with data. This could take a long time to build manually. However, you could build this with Particle Generator in the almost the same time as it take you to build just one of those items.

Jessica

bottle washer

Gary

janitor

Andrew

bottle washer

Gary

slave

Brian

janitor

Chris

slave

Jacob

bottle washer

Brian

slave

Wolf

CEO

Davide

bottle washer

Andrew

slave

Josh

janitor

Jacob

slave

Davide

bottle washer

Josh

janitor

Reviews

We have recently started gathering reviews for our products. So if you don't see a review above, be the first to submit a review and let others know how you like this stack.

Screenshots

Tutorials

Loading...

Downloads

Updates

See all updates Thanks!

You may also like…

Subscribe

For product releases and updates by email, please subscribe below.

© 2024 Weavers Space | Terms of Service | Privacy Policy