Nautilus Dots Preloader

The Nautilus Dots Preloader is a soft, simple way to let your users know your content is on its way. Using glowing dots to represent the loader’s progress, the preloader creates a sense of depth by positioning and scaling the dots as though they were approaching the user. This effect is reinforced with a shadowing effect beneath the dots. The preloader will automatically reposition itself if the stage is resized or fullscreen mode is toggled. This preloader is 100% code-driven, so there are no graphics to include!

There are several settings you can use to customize this preloader. Several of these settings can be tried out right now by clicking on the ‘settings’ bar in the demo above. The full list of settings is:

• bgColor – This is the base color used to create the background.
• dotColor – The color of the dots
• spotlightColor – The color of the light underneath the circular dots.
• txtColor – The color of the percentage text
• txtFont – This is the name of the font used for the percentage text and any messages. The font you specify here needs to be embedded in your project to show up properly. A text field is provided in the preloader where you can change the embedded font.
• preloaderRadius – The radius of the circle of dots (half its width)
• glowAlpha – The alpha/opacity of the glow on the dots
• glowBlur – The amount of blurring to apply to the glow on the dots
• showSpotlight – A true/false value that controls whether or not to show the spotlight
• showText – A true/false value that controls whether or not to show the percentage text
• showReflection – A true/false value that controls whether or not to show the percentage text’s reflection
• showShadows – A true/false value that controls whether or not to show the shadows cast by the dots
• showBackground – A true/false value that controls whether or not to show the background behind the preloader.
• fadeOutAtEnd – A true/false value that controls whether or not the preloader fades out when it’s finished before moving to Frame 2.

All settings are accessed in their own layer in the preloader’s MovieClip, making it quick and easy to change the appearance of the preloader to suit your project’s needs. To use the preloader, simply place it on Frame 1 of your timeline, and begin your project on Frame 2. The preloader does the rest! Full instructions on how to implement and customize this preloader are included with your purchase.

This preloader uses the freeware, TrueType font Alte Haas Grotesk. It’s available on dafont.com (www.dafont.com/alte-haas-grotesk.font). Instructions on how to use this font or any font you prefer in this preloader is included with your download.

Message Rotation

This preloader has the ability to display messages to the user while your content is loading. The messages support basic HTML tags. Control font size, message duration, and looping. It’s completely optional, and all controlled through an XML file. No coding required! Instructions on how to make use of the message rotator are included with your purchase. Like the preloader but don’t want messages? Just leave out the XML file and you’re all set!

Thank you and enjoy!

More Modulus Products

Galleries

Utilities

Preloaders