30.9.2008

Mistä on pieni Heijastuspinta tehty

Näin siis on Heijastuspinta ottanut askeleen suuntaan X ja uudistunut ilmeeltään. Taustaväri on tummanharmaa (on se), blogitekstien pohja valkoinen ja tehostevärinä toimii vaaleanpunainen. Yläoikealla komeilee tämän hetken suosikkiasu tai -kuva, se vaihtunee vielä tarkemmin määrittelemättömän ajan välein. Kuvan vieressä ovat kuvaustekstit. Taustalla kiemurtelee pari Hawksmontin vapailla brusheilla tehtyä kasvillisuuskiemuraa, jotka hehkuvat vaaleanpunaista väriä.

Kuten mainitsinkin, olen suunnitellut ulkoasua viikkokaupalla. Ensimmäiset luonnokset tein jo kesällä, ja suunnitelmat ovat ehtineet muuttua moneen kertaan. Eniten päänvaivaa tuotti banneriosion ideointi ja toteutus - on yllättävän pitkällinen prosessi kehittää jotakin omaa silmää miellyttävää, mutta samalla toimivaa ratkaisua ilman selkeää visiota siitä, mitä haluaa. Selvää oli vain se, että tekstipohja on valkoinen, kaksipalstainen ja sivupalkki sijoittuu oikealle. No okei, selvää oli myös se, että tekstipohjan ja sivupalkin mittasuhteet saavat säilyä - riittävän leveä tekstipohja antaa kuville enemmän toiminnanvaraa kuin kapea.

Ulkoasussa yksinkertaisuus höystettynä muutamilla harkituilla yksityiskohdilla muodostui kantavaksi ideaksi. Lopputulos on jopa niin yksinkertainen, että on lähes uskomatonta, miten paljon aikaa sen suunnitteluun on tullut käytettyä.

Pähkäillessäni oman blogi-ilmeeni muodostamista selailin lukuisia blogeja ja designlistauksia. Hain innoitusta skräppäysblogeista, erityisesti Inspiroidu-blogin selailu oli inspiroivaa, vaikka en lopulta päätynytkään sitä kautta saamaani sommitteluratkaisuun. Erityisen paljon tulin tuijotelleeksi Mashablen artikkelia 50 More Beautiful Blogger Templates. Myös Smashing Magazinen 45 Excellent Blog Designs ja 30 More Excellent Blog Designs antoivat ajatuksia värimaailmasta ja varsinkin bannerigrafiikoiden erilaisista mahdollisuuksista. En halunnut perinteistä, laatikon mallista banneria, vaan jotain ovelaa.

Myös kanssablogaajieni blogeja tuijotin Sillä Silmällä, osansa kyttäyksestäni sai varmasti jokainen blogi, johon olen koskaan törmännyt, mutta erityistä huomiotani saivat niin Heidi (sivupalkki nousee hauskasti eri tasolle kuin tekstikenttä), Nomppa (jännittävät bannerit), Ia (omaperäisyyttä suorastaan henkivä blogimalli), kuin Honey Junkiekin, jonka vaaleapunainen linkkiväri teksteissä ja sivupalkissa lämmitti syvästi kuin Filippa K:n villatunika. Erilaisuuden tuskissa pohdin pitkään sitä, pitäisikö vaikka väen vängällä yrittää mieltyä johonkin toiseen väriin, mutta surffattuani totesin, ettei vaaleanpunainen yhdistettynä tummaan väriin ja valkoiseen ole niin uniikki yhdistelmä, etteikö sitä voisi käyttää senkin uhalla, että joku syyttää matkimisesta. Onhan hengentuotokseni lopulta muutenkin yhdistelmä eri lähteistä apinoituja ideoita.

Koska monimutkaisin koodirakenne, jonka osaan luoda, liittyy kuviin ja niiden linkitykseen, pestasin poikaystävän naputtelemaan Gimpillä vääntämäni ideat käytännöksi. Pitkään sain vinkua, mutta se osoittautui lopulta hyväksi asiaksi, ilman vitkuttelua olisin ehkä tyytynyt astetta kömpelömpään banneriratkaisuun. Ajatukset kääntyivät koodiksi joissakin tunneissa yöllä ja seuranneena päivänä. Väkertelyä helpotti huomattavasti se, että Bloggerin omaa Minima-mallia oli helppo käyttää pohjana ja tehdä siihen tarvittavat muutokset. Minima sai myös sanella sen, miltä sivupalkki näyttää.

Kun fontteja, otsikoiden kokoa ja asettelua ja vähän kaikkea muutakin oli riittävästi säädetty ja grafiikkoja juoksetettu optimointifilttereiden läpi silmät sirissä pikselimössöä kytäten, saatoin aloittaa meditaatiovaiheen, jonka tarkoitus oli tuijottaa ulkoasua testiblogissa riittävän pitkään, jotta kaikki mikä on huonosti, hioutuisi pois.

Pidän lopputulosta onnistuneena. Erityisen mukavaa on se, että tämä vastaa makumieltymyksiäni paremmin kuin entinen ulkoasu, jonka Tolkien-vibat olivat toki erittäin kivoja, mutta silti jonkun verran off-topic. Onhan se myös hieno tunne ajatella, että ulkoasua on voinut itse ideoida ja grafiikoiden osalta toteuttaakin merkittävissä määrin. Uuden ulkoasun vahvuutena on myös helppo muokattavuus - värejä ja bannerigrafiikkaa on suhteellisen yksinkertaista muuttaa, ja mielessäni siintääkin jo ideoita taustavärin asteittaisesta vaalentamisesta kevättä kohti, ja joulun tienoilla blogia voikin koristella hohtavin lumihiutalein. Koko bannerin konseptin voi senkin laittaa hyvin helposti remonttiin, ei muuta kuin uutta kuvaa tilalle.

Siinä mielessä puhisen suoranaista ylpeyttä lapsukaistani kohtaan, etten ole pitänyt itseäni kovinkaan visuaalisesti luovana, ideoita pursuilevana ihmisenä, kuviksennumeroni pyöri aina jossain seiskan ja kasin tietämillä, ja oikeastaan vasta valokuvauksen ja kuvanmuokkauksen myötä olen alkanut osoittaa joitakin taiteellisia ja muka-taiteellisia piirteitä. Toivottavasti en kyllästy lapsukaiseeni nyt ihan heti, kun olen viimein saanut sen pitkällisen kypsyttelyn jälkeen valmiiksi.

Nostalgiahuuma taitaa olla vielä hieman aikaista tässä vaiheessa, mutta ehkä sitten tulevaisuudessa voi kaihoisin mielin tuijotella tätäkin kuvaa, jonka saa muuten klikattua isommaksi:


Rakentavia kehitysehdotuksia saa ja on toivottavaa heitellä. Makuasioista en ala tinkimään, mutta esimerkiksi luettavuutta ja käytettävyyttä parannan mielelläni.

24 kommenttia :

moonfish kirjoitti...

Hieno ulkoasu! Määkin tahon!

Voisitko millään muuttaa kuviesi (taitaa olla yläbanneri ja asukuva) linkkejä niin, että niissä ei lue sanaa "banneri"?
Mulla tulee blokattua kaikki "banner"-linkit suoraan adblockilla ;(

Nomppa kirjoitti...

Wou, tästähän tuli ihan sairaan hieno! Tää on jotenkin paljon enemmän sun näkönen, juu nou :--)

Rhia kirjoitti...

Hyvältä näyttää =) en tiedä onko vika nyt minussa, silmissäni vai jossakin oman koneeni suorituksellisissa ominaisuuksissa mutta otsikkotekstit näkyvät siansaksana... Puuttuukohan multa joku fontti?

MouMou kirjoitti...

Ulkoasusta tuli ihana!<3

Salla kirjoitti...

Tää on kyllä ihan törkeän hieno ja etenkin erilainen muiden blogien templateihin verrattuna. :)

Stazzy kirjoitti...

Hämmennyin suorastaan hetkeksi. missä mä oon??? Hiano se on :)

Kateellinen kun jollakin on koodaava poiccis kotona.

ainu kirjoitti...

Oi miten kaunis tausta :)! Oli oikein iloinen yllätys kun napsautin itseni tänne..

Elina kirjoitti...

Onko tarkotus, että mulla näkyy vain "ijastuspinta" otsikossa?! :S No, mutta jokatapauksessa, oikein hieno on :) Onnea vaan sen johdosta!

Stazzy kirjoitti...

Niin, siis, ei sillä että oudot resoluutiot muitakaan hellisivät, mutta tämä vaatii näköjään vähintään 1024x768, ja sittenkin leikkaa pikkuisen sivuilta. Oikeanpuoleinen "kukka" ei näy kuin puoliksi.

Kursiiviteksti on vähän raskasta lukea etenkin kehnommalta näytöltä.
Muuten tämä on vallan toimiva ja luettava, linkit erottuvat ja kontrasteja on tarpeeksi.

Noihin vapaisiin brusheihin pitääkin tutustua tarkemmin.

Idhren kirjoitti...

moonfish, todellako :o Pitää katsoa asiaa. Tietysti voit myös itse säätää Adblockiin niin, että sallit tämän sivun näkyväksi.

Nomppa, tänks :)

Rhia, fonttien pitäisi kyllä olla sillä tavalla, että vaihtoehtoja on oletusfontin (Helvetica Neue) lisäksi Helvetica ja Arial. Onko sulla ne? :D Mutta kiitti.

Moumou, kiitti :)

Salla, erilaisinta ehkä tuo banneriratkaisu, muutenhan tää on aika peruskauraa :P Mut kiitti :)

Stazzy, kiitos.

Ainu, hauska kuulla :)

Elina, ei, se ei ole normaalia :D Heijastuspinta-teksti on upotettu suoraan taustakuvaan, ilmeisesti se ei sitten asetukaan kaikilla resoilla nätisti. Korjaan tuon.

Stazzy, useimmat websivuthan lähtee juuri tuosta 1024 x 769:sta, taitaa olla yks yleisimmistä tällä hetkellä :> Mut katsellaan mitä voidaan tehdä. Kiitti hyvästä palautteesta :)

Idhren kirjoitti...

Elina, ilmeisesti olet suurentanut sivua selaimessasi, testailun jälkeen se näyttäisi olevan ainoa keino, jolla tuon taustakuvan saa leikkautumaan kuvailemallasi tavalla. Onko fontti liian pientä lukea, jos zoomaat ulos?

Stazzy, taustakuvassa ajattelin jotenkin niin, että sen ei tarvitse näkyä kokonaan, ja tuo oikeanpuoleinen kukka on muutenkin aseteltu puoliksi sivupalkin alle. Tärkeintä on kuitenkin se, että sisälmykset olisivat suht. oikein ja bannerigrafiikka näkyisi.

Kursiivitekstin muutin normaaliksi, ei se oikein enää ollut niin funktionaalinen juttu kuin edellisessä layoutissa. Edellisessä se auttoi tekstilitaniaa erottumaan, mutta tässä tuo sivupalkki on muutenkin erillään ja osioiden välissä ilmaa kuin torstaipierussa.

Emmanuelle kirjoitti...

Tosi hieno uusi ulkoasu. <3

tini kirjoitti...

On tämä hieno! Pidä teksti yhtä purevana kuin aikaisemminkin niin kaikki hyvin :)

Idhren kirjoitti...

Emmanulle, kiitos kiitos ^^

Tini, kiitti sullekin :) Joo, ei hätää, pidetään ;)

poster kirjoitti...

Makea ulkoasu! Woooou.
*aplodit*

Tajusin muuten tässä kai tänään, etten oo tänne kommentoinut ziljardiin vuoteen! :o Vaikka aina käyn kaikki päivitykset tsekkaamassa, kun vaan netissä pyörin. Hui.

Idhren kirjoitti...

Poster, kiitos :) Ja tiekkö, mä tossa just pähkäsin Demiä selatessani, että luetkohan enää, kun ei ole kommentteja vaihteeksi tullut :D

poster kirjoitti...

Hahaa! Ehkäpä kommentoimattomuus johtuu siitä, etten oo löytänyt pilkunviilattavaa? Tai sitten kaiken voi pistää ah-niin-rakkaiden ylppäreiden piikkiin. Mutta nyt oon takaisin bisneksissä! Wipii. (:D)

Idhren kirjoitti...

Ai niin tosiaan, ylppäritkin tosiaan pyörii nyt :D No ei ihme sit ;) Nimimerkki pitäis kans tälläkin hetkellä lukea tenttiin eikä surffata blogeissa ;o

r kirjoitti...

Hieno on tää uus, vaikuttaa kyl ihan sun tyyliseltä. Noista kukista tulee mieleen PixelJunk Eden -peli :)

Idhren kirjoitti...

R, arvaa sanoko poikkis ihan samaa, ja olinko itsekin ihan et aijaa kun seurasin tuon pelaamista :D On muuten aika vekkuli ja ennenkaikkea näyttävä peli :D

r kirjoitti...

Onhan se vekkuli mutta kyllä välillä tulee hienosti kiroiltuakin kun sitä pelaa heh. Mun bf ei tykkää et pelaan sitä kun en suostu lopettaan ja mulla menee aina hermot lopuks :D

Idhren kirjoitti...

Se kohta selkeästi lähestyy tuollakin mitä pidemmälle pelaa :D

sugar kane kirjoitti...

Hyvälät näyttää uusi ulkoasu! Rauhallinen ja tyylikäs, ja mä pidän leveästä tekstitilasta ja tietty isoista kuvista.

Oliskos sellainen mahdollista, että esim. arkistojesi aarteiden kahlailusta pääsisi yläbanneria (tekstiää HEijastustpinta) klikkaamalla takaisin etusivulle?

Idhren kirjoitti...

Sugar kane, on ollut suunnitelmissa sellainen toki, mikseipä sitä voisi toteuttaakin :) Lisäsin väliaikaisratkaisuksi Kukamitähäh-osioon linkin sanasta "Heijastuspinnan" etusivulle, alkoi itseäkin ärsyttää heikko navigaatio ;o

Related Posts Plugin for WordPress, Blogger...