Well, Michelangelo has submitted to pressure and the resulting Hype Titles stack includes 17 different animations with 29 built-in fonts and an option for Google Fonts.
For both the Title and the slogan, you'll find settings not only for the font, but also for size and font style. The Title font can be shifted up / down / left or right by 50px and 70 px respectively.The slogan can be shifted up / down / left or right by 200px and 600px respectively and can be rotated up to 90º in either direction.
As you can see in the demo above, the title can be made up of two different colours. The slogan and the animated line[s] are coloured separately. Unlike the screenshot above, Hype Titles animates once. Either immediately or after a 1 second / 2 second pause. Hype Titles can also be set to static.
It must be noted that Hype Titles is conceived as a banner stack i.e. it will always appear at the top of your page and saves us from the agony of having multiple animated headlines on a page. The default Stacks option to add a background colour or an image to the stack allows Hype Titles to be displayed over a banner image.
It's worth taking a look at Michelangelo's demo page it has 25 x 16 different examples of how Hype Titles can make your next project pop.Your Header at least won't be boring. And if you like a specific Title, the demo project contains every page from the demo so you can simply copy and paste and add your own text without needing to experiment.
JW's Filters Stack removes the secrets from said CSS effects and not only lets you easily choose from over 40 image effects, but also apply the effects to complete layout elements – hover effects included.
With Filters you can standardise all of the images on your web page by applying the same filter to every image; you have complete control over blur, brightness hue, etc. and you can apply hover effects that, for example, turn a black and white or sepia image into a full colour image.
Filters is delivered with 2 stacks. Filter Presets with (if I counted correctly) 41 different filter effects, and Filter Pro which allows you to build your own effects and to apply them to a 'Scope' i.e. to Images, Class, All, Custom Selector.
The effects possible with Filter Pro are: Greyscale, Sepia, Brightness, Contrast, Saturate, Invert, Hue, Opacity, Blur, Blend Mode, Duotone and Hover effects. Any or all of these effects can be combined with each other.
Filters will easily make your website more interesting and can draw attention to specific page elements. Total CMS users will be interested to know that Filters is fully compatible and can easily change whole pages of images.
The only downside: You won't be able to fully appreciate Joe's demo project without first investing in his Wallpaper and Target stacks.
The internet is no longer a static entity. With the abundance of information to be displayed in the confined space of a web page, it makes sense to hide some details until the user really needs it. Aside from that, moving elements can make a page more interesting. The Fluid demo page is extremely interesting with elements that move when clicked and slide into view when the page is scrolled — the page simply begs for your attention.
But Fluid isn't simply about motion, it allows you, as the demo page shows, to build complete web pages that include floating menus and most of the page content you need.
Using the Fluid Suite, you can add Buttons, Icons, Images and Text in addition to the default Fluid stack the Fluid Container, State Manager and Trigger.
The main Fluid stack supplies the JS necessary for any transitions whilst the Fluid Container will accommodate any of the other stacks. The Trigger stack defines when/how a transition should take place and the State Manager allows you to define the transition.
Just about any imaginable state is possible; from simply changing an element's colour upon hover, over opacity, rotation, zoom or positioning etc. on hover, click or page movement. There are many more transitions (z-Index, Object Size etc.) available.
So back to the 'learning curve'. After viewing the initial demo project with 11 pages of examples, I felt a little daunted. I contacted Skyler and he supplied a project with five pages that made things a whole lot more understandable!
Three things that you'll need to remember before you commit to Fluid:
Fluid is an amazing product that will allow you to build RW pages that you never imagined before.
Fluid has a fairly steep learning curve that is aided by Skyler's new demo project.
Less is more! You might want to let rip and animate everything on you newest RW pages. But don't overdo it!
Too much movement eventually distracts from your content, in addition to which the JS necessary to move all of your page elements can quickly become quite large.
Your project size might not matter to users in areas with good internet accessibility, but always remember that the JS necessary for any animation adds to the project size and your product might be viewed on a mobile phone or in other areas where every Kb costs your visitor valuable $.
Michelangelo from Multithemes is one of the developers that delivers high quality and highly customisable themes. His latest creation, HYPE, is no exception. There are so many options for customisation that I shan't even attempt to go over them. Suffice it to say that if you deploy HYPE, you most certainly won't be disappointed.
There are 16 different web fonts available for title, slogan and Headlines, accompanied by web-safe fonts for your content. Animated Social Icons come as part of the deal, as do animated FA Icons. However, what immediately jumps out at visitors to Michelangelo's demo site, are the animated SVG headers. There are 16 different options to animate each page's title/slogan combination and the animations are so riveting that admirers have already enquired if they will be available as a stack!
I spent a couple of hours exploring HYPE's customisation options and if you're going to deploy the theme, you'll want to do the same. Whilst the default setup is attractive, there are so many options that HYPE can be almost anything you want it to be. However, you can rest assured that however much you tweak HYPE, it's always going to look good with the RW standard pages (assuming, of course that you're not colourblind) and that the theme will play along equally well with Stacks pages. That animated header will ensure that your pages will POP and two ExtraContent areas secure your pages' flexibility!
If you prefer the convenience of a prefabricated theme, but want extreme flexibility, then I highly recommend taking a look at HYPE
Assemble offers up to 17 different animations which can be staggered and offset. Assemble also allows you to set the Target mode. The result is an almost endless array of settings. But perhaps the most interesting fact is that it's possible to manually choose elements and/or list classes to let the stack know which partial segments should be animated.
The whole process is relatively complicated to describe and a picture says more than a thousand words, so why don't you take a look at the Assemble demo page to see what Assemble can do. I promise that you won't be disappointed.
[Animation] Type – 17 options
Speed – ms
Stagger – Adjust the total possible time between the first segment animation till the last. 1000ms would mean each segment will animate randomly in between 0 and 1000 milliseconds. Decrease this value to have the segments animate closer together
Offset – Adjust the distance from the top of the browser window the animation initializes. 100% will cause the animation to start as soon as it is inside the browser window. 30% will cause the animation to start only when the element is in the top half of the window
Target Mode – Automatic Segmented, Automatic Whole, Manual Segmented
If you're into animated page elements, Assemble offers a few innovative options which, when used sparingly, can make your page all the more interesting.
Links to the developers ® All trademarks cited on this page are the property of their respective owners.
Do you have a question regarding RapidWeaver?
Would you like help with your new project?
Would you like us to build your new RapidWeaver website?
Don’t miss a post!
Sign up for our monthly newsletter.
A monthly digest of all the latest updates from our RapidWeaver blog, keeping you up to date with the hottest new stacks and themes.
265 Moo 2
Mae Na Toeng Nai, Pai
Mae Hong Son
We design websites and print-products for small businesses at reasonable prices. We specialise in Responsive Web Design.
We do not harvest or sell personal information.
© rjh web design 2010—16