Digital first
Content
Codesnippets

Digital first

Content
Codesnippets

Wie erneuert man eine erfolgreiche Marke? Eigentlich tut sie das von selbst, denn eine erfolgreiche Marke ist ihrer Zeit stets voraus. Deshalb lassen wir sie freier atmen und denken um. Das heißt: Wir denken vom Digitalen her. Das Erscheinungsbild ist kein statisches Gerüst mehr, sondern ein lebendiges Interface, das mit den Menschen interagiert.

Diese Plattform ist ein direkter, unkomplizierter Weg zum gestalterischen Umgang mit der Marke Audi. Mit vielen Beispielen und Anleitungen, die das Wesentliche vermitteln und zu Ideen anregen – und vor allem: so aufgebaut, dass man sofort anfangen kann.

Klicken Sie einfach hinein. Viel Freude!

Highlights

 

Größenkalkulator

Der Größenkalkulator hilft dabei, das korrekte Verhältnis von Ringen und Typografie zu berechnen.

 

Codevorschau

Die digitalen Komponenten werden in einer interaktiven Codevorschau gezeigt und mit einem Link zur Entwicklungsplattform GitHub bereitgestellt.

 

HTML
<button class="aui-button aui-button--primary aui-js-response" type="button">Primary Button</button>
 

Icon Bibliothek

Die Icon Bibliothek enthält eine breite Anzahl an Icons in jeweils zwei Größen. Alle Audi Icons stehen als SVG und Iconfont für digitale Anwendungen, als EPS für Printanwendungen und als PNG für digitale Anwendungen und MS Office zur Verfügung.

  • adblue
  • adblue-alert
  • anti-theft-alarm-system
  • anti-theft-alarm-system-alert
  • bonnet-open
  • brake-pad
  • brake-pad-alert
  • car-dimensions
  • caution
  • charging-plate
  • climate
  • climate-auto
  • climate-electric
  • co2-emission
  • connect-key
  • consumption
  • cross-traffic-assist-rear
  • cubic-capacity
  • door-open
  • engine
  • geofence
  • geofence-alert
  • honk
  • honk-and-flash
  • indicators
  • interior-configuration
  • lights-day
  • lights-dim
  • lights-full-beam
  • lights-led
  • lights-xenon
  • lock
  • lock-unlock
  • loose-wheel-indicator
  • maneuvering-assist
  • mileage
  • mmi
  • nfc
  • nfc-inactive
  • oil-change
  • piloted-parking
  • power
  • pre-heating
  • quattro
  • roof-open
  • side-assist
  • time
  • time-climate1
  • time-climate2
  • time-long
  • time-middle
  • time-short
  • top-speed
  • torque
  • trailer-maneuver
  • transmission
  • trunk-open
  • vehicle-signal
  • vehicle-wi-fi-1
  • vehicle-wi-fi-2
  • vehicle-wi-fi-3
  • vehicle-wi-fi-4
  • velocity
  • velocity-alert
  • administrator
  • arrow-down
  • arrow-narrow-down
  • arrow-narrow-up
  • arrow-up
  • back
  • bookmark
  • cancel
  • code
  • compare
  • dashboard
  • edit
  • erase
  • favorite
  • filter
  • forward
  • grab
  • groups
  • home
  • idea
  • languages
  • line
  • list
  • login
  • main-user
  • more
  • myaudi-destinations
  • off-canvas
  • print
  • profile
  • search
  • select
  • select-all
  • settings
  • share
  • share-android
  • system-add
  • system-cancel
  • system-code
  • system-compare
  • system-favorites
  • system-help
  • system-info
  • system-print
  • system-remove
  • system-search
  • system-select
  • system-settings
  • system-share
  • system-share-android
  • user
  • user-whole-body
  • address-book
  • announcements
  • blog-post
  • calendar-events
  • content-activities
  • direct-mail
  • discussion
  • feed
  • group-discussion
  • hotline
  • logbook
  • mobile-phone
  • news
  • projects
  • receive-e-mail-notification
  • send-to-vehicle
  • status-update
  • system-follow
  • system-paragraph
  • voice-call
  • voice-call-1
  • voice-call-2
  • voice-call-3
  • apps
  • aupeo
  • facebook
  • google-plus
  • instagram
  • line-me
  • linkedin
  • napster
  • pinterest
  • rss-feed
  • snapchat
  • social-reader
  • system-facebook
  • system-google-plus
  • system-instagram
  • system-line-me
  • system-linkedin
  • system-pinterest
  • system-snapchat
  • system-twitter
  • system-vimeo
  • system-wechat
  • system-weibo
  • system-xing
  • system-yelp
  • system-youku
  • system-youtube
  • system-zhihu
  • twitter
  • vimeo
  • wechat
  • weibo
  • xing
  • yelp
  • youku
  • youtube
  • zhihu
  • arrow-left-light
  • arrow-left-normal
  • arrow-left-sharp
  • arrow-left-u-turn
  • arrow-right-light
  • arrow-right-normal
  • arrow-right-sharp
  • arrow-right-u-turn
  • arrow-straight-down
  • arrow-straight-up
  • business-address
  • distance
  • gps
  • offline-maps
  • parking
  • parking-in-left
  • parking-in-left-long
  • parking-in-right
  • parking-in-right-long
  • parking-in-straight
  • parking-out-left
  • parking-out-left-long
  • parking-out-right
  • parking-out-right-long
  • parking-out-straight
  • poi
  • poi-calendar
  • poi-car
  • poi-contact
  • poi-favorite
  • poi-home
  • poi-last-destination
  • poi-search
  • poi-work
  • pois
  • recommended-destination
  • results-list
  • roundabout-left
  • roundabout-long-left
  • roundabout-long-right
  • roundabout-right
  • roundabout-sharp-left
  • roundabout-sharp-right
  • roundabout-straight
  • tour
  • traffic
  • traffic-sign-recognition
  • traffic-sign-recognition-alert
  • work
  • audio-volume
  • camera
  • catalogue
  • document-pdf
  • document-pricelist-dollar
  • document-pricelist-euro
  • document-taxation
  • documents
  • download
  • editorial
  • notepad
  • pause
  • photo
  • play
  • polls
  • replay
  • resize-decrease
  • resize-increase
  • rotate-image-left
  • rotate-image-right
  • rotate-left
  • rotate-right
  • shuffle
  • skip-next
  • skip-previous
  • sync
  • system-audio-off
  • system-audio-on
  • system-download
  • system-pause
  • system-play
  • system-play-backwards
  • system-replay
  • system-resize-decrease
  • system-resize-increase
  • system-save-as
  • system-skip-next
  • system-skip-previous
  • system-sync
  • system-upload
  • tag
  • video
  • view-360
  • weblink
  • break
  • business-customer
  • calculator
  • car
  • car-handover
  • car-search
  • clothing
  • credit-card
  • dealer-request
  • dealer-search
  • feature-on-demand
  • financial-services
  • gift
  • inspection
  • merchandise
  • my-dealer
  • private-customer
  • public-transport
  • shopping-basket
  • test-drive
  • train
  • tube
  • used-car-search
  • used-cars
  • valet-parking
  • walk
  • warranty
  • charge-level
  • charging
  • charging-station
  • electric-range
  • fuel-range
  • fuel-station
  • gas-station