Content Adaption
Content production is expensive and time consuming and to save ressources, re-cycling of existing media assets can be a strategy to produce "new" content for the ring. As the interface is very likely a different one as the original content was intended for, we need modify the original content. There are two ways of modifying the content. 1. We have the sources of the content and are able to modify it. 2. We do not have the source material anymore, but adapt it by using TouchDesigners capabilities.
This page gathers ways of adaption for various content types.
Responsive Webpages
DOM is manipulated using javascript c.f. Showcase Karolinenstrasse
Autoactive Video
c.f. Ideenreise
Example Media Asset Re-use
c.f. Ideenreise
SCB Corporate Identity
Smart City Bamberg (SCB) has its own Corporate Design (CD), but not yet its own Design System. In general our recommendation is, to request contractors who create digital assets for you to provide them through a (static) Design System. A good example is the Stadtwerke Bamberg Design System which creates value by making assets resusable for all stakeholders who might become involved in asset creation.
This section gathers some CD guidelines and assets from SCB CD we came across.
Web-Fonts
Font: Rubik Bold
Fontgröße: 80 pt
Zeilenhöhe: 100%
Buchstabenabstand: 0%
font-family: 'Rubik', sans-serif;
font-weight: bold;
font-size: 80pt;
line-height: 100%;
letter-spacing: 0%;
Colours
Linearer Gradient
background: linear-gradient(to right, #E31F32 0%, #622180 50%, #0085CB 100%);
Components
<button style="background: linear-gradient(to right, #E31F32 0%, #622180 50%, #0085CB 100%); color: white; border-radius: 10px;">
Primärbutton
</button>
<button style="background: #0085CB; color: white; border-radius: 10px;">
Sekundärbutton
</button>
<a href="#" style="color: #0085CB;">Textlink</a>
Label
<span style="background-color: #E31F32; color: white; padding: 5px 10px; border-radius: 10px;">Label</span>