Grafisk design 47
Grafisk design programmer: indesign, photoshop
Satya Yoga var flyttet til nye lokaler, som de selv havde istandsat. Et redesign af deres website skulle markere skiftet og tiltrĂŚkke nye kunder. Kravene var at deres logo skulle beholdes og at de selv skulle kunne opdatere sitet.
48 Grafisk design
Hvem Bag ved Satya Yoga står to undervisere. De udbyder Iyengar Yoga hvor de lægger stor vægt på at balancere stabilitet og mobilitet, styrke og fleksibilitet både i krop og sind. Deres yoga-praksis skal støtte liv og dagligdag. målgruppe Området, hvor de nyrenoverede lokaler er placeret, er meget hipt med små nichebutikker og caféer. Det er et kreativt miljø med mange unge studerende og småbørnsfamilier.
Moodboard / Typografi
Grafisk design 49
50 Grafisk design
12 column grid Jeg bruger 960 gridsystem til at designe sitet. Det giver mig nogle gode proportioner at arbejde med. Der er 12 kolonner à 60px med 11 mellemrum à 20px og dertil en margin i venstre og højre side på 10px. Sitet er altså 960px bredt og fungerer optimalt indenfor en standard computerskærms breddemål på 1024px. Opensource cmssystem Wordpress, Drupal, Joomla er de mest brugte opensource cmssystemer. De leverer en back-end som gør det let at opdatere sit site uden krav om kendskab til kodning og vil være perfekt til sitet.
design før Satya Yogas logo er et mandala. Et komplekst symmetrisk symbol. Designet bliver fladt når kontrasten mellem logo og tekst er for stor. Der er for meget småt tekst. Der mangler identitet og forklaring til at afkode denne type yoga. Der mangler stemning.
Grafisk design 51
bomærke / Typografi Jeg vælger at skabe et bomærke med googlefonten Crete Round. Det er en slab serif font med en lav x-højde der giver tyngde til det komplekse logo. Bomærket holdes i minuskler fordi orderne indeholder flere bogstaver med nedhæng. Det giver ro. Centreringen af bomærket under logoet giver logoet plads og kontrast.
satya yoga design efter Logoet beholdes i stor størrelse, men får luft af at blive centreret. Logoet får modspil af bomærket. Der er prioriteret i menuen og der er synlig aktualitet i højre spalte. Man får via billederne hurtigt indtryk af yogaen og stedet. Væsentlige teasere viser udbydet og leder ind i sitet.
Create Round bruges også i menu, overskrifter og andre fremhævede titler. Den sekundære font er den websikre Trebuchet som bruges til alt <p> tekst.
52窶エrafisk design
<link href='http://fonts.googleapis.com/css?family=Crete+Round' rel='stylesheet' type='text/css'>
HTml / googlefonT / css For at bruge fonten linker man via ovenstﾃ･ende link til googlefont. Koden implementeres i <head>. Fonten defineres i css. For eksempel pﾃ･ class selektoren .headline
.headline{ font-family: 'Crete+Round', arial, serif; font-weight: 20px; }
Grafisk design 53
Undersider Griddet kan bruges i mange kombinationer. Spalterne og overskrifter tillader mange informationer på siden uden at det bliver uoverskueligt.
Index
Hold
Workshops
Undervisere
Iyengar Yoga
Site map Menuen er reduceret til fire undersider. Det nye grid skaber en bedre overskuelighed og derfor kan skema og priser sagtens stå på samme side som hold. Yderligere undersider er derfor unødvendige.