Media Components
Image (Hybrid)
The Image component features an image and provides the option to include a text (description) below the image.
Mobile Version
Image Gallery (Hybrid)
The image gallery features more than one image and allows an user to click through the selected images. A short description can be added to each image.
Mobile Version
Image Teaser (Hybrid)
Here you can either enter a headline (either in grey or white) in the top left-hand corner as in the first example or in a red box as an overlay (position is electable).
Mobile Version
Image Thumb Slider (Hybrid)
Here you also have the option of placing an overlay with a caption on the image. You can also add videos and have the possibility to mix images and videos within one component.
Mobile Version
Slider (Hybrid)
A slider can be created either with or without an overlay. You can select both images and videos for sliders and including a caption is optional. Once overlay/caption/nothing is selected it is applied to all elements within the component.
Mobile Version
Video (Hybrid)
There is also the option of including a video. The thumbnail of the video can be any image that is uploaded to the media project. The video itself should either be uploaded to Youtube or if it is an internal video, you can send it to the Corporate Marketing team.
Mobile Version
Auto Play Video (Hybrid)
Will be played automatically without a user having to click anything. This is mainly used for GIF's. However, it it is required to have it as a .mp4 file instead as a .gif file The loop (that is classic for a GIF) is created automatically by the component.
Mobile Version
Simple Icon Image (Only in Grid)
Only possible to have either grey, red or green.
Mobile Version
Vector Image (Hybrid)
This is only used for logos that do not have the required measurements (vector graphics).
Mobile Version
Media Stage (only outside of Grid)
The media stage features images/videos including an overlay caption (in the right bottom corner) and a headline like text for each image/video (in the left upper corner). By clicking on the arrows a user can click through the images/videos at their pace and has the possibility to maximize an image by clicking on the magnifier.
Mobile Version
Content Slider (only outside of Grid)
The content slider provides the option to include many images within one slider. A user can view through the images when clicking on the arrows in the top right corner. Links are optional and it is possible to inlcude some text per image.
Mobile Version
Image Stage (Hybrid)
This component features images with an overlay box that includes a headline, a text and an optional link. It is possible to activate "automatic sliding" which means that there is no need for a user to manually click through the slider.
Mobile Version
Image Icon (Hybrid)
The ImageIcon can be used, when an icon needs to be shown on an image and will be visible in the right bottom corner.
Simple Annotated Image (Hybrid)
Here it is possible to add these little numbers on specific places on the image. Explanations for the respective numbers could potentially be included in a text block component.
Mobile Version
Text Annotated Image (Hybrid)
The text is not directly on the image itself but can manually be edited within FirstSpirit. Attention: in the mobile version the text is not displayed by default.
Gradient teaser (Hybrid)
The GradientTeaser gives us the possibility to highlight specific texts with an image and a headline.
Mobile Version
Tile Stage (only outside of Grid)
The Tile Stage consists of a background image and up to three tiles (either three, two or one tile are possible). The image tile always has a zoom and the icons for the icon tiles can be freely chosen from the pool of available icons.
Mobile Version
Slidecontrol (only outside of Grid)
With this component, the user is able to compare e.g. two roomscenes. If the slide bar is moved from left to right, the left image takes more room and vice versa.
Mobile Version
