Doctor Who website: helemaal klaar nu?

Door runelaenen op woensdag 15 oktober 2014 21:40 - Reacties (13)
Categorie: Websites, Views: 4.454

Zo, een dikke maand (eigenlijk bijna 2 maanden) nadat ik de website Sonic Biro heb overgenomen is hij volgens mij helemaal klaar. Voor nu althans.
De voorbije maanden heb ik hieraan gewerkt:

Nieuw logo en design
Ik wilde een nieuwe uitstraling. De website bestond sinds 2006 en is al enkele keren van uiterlijk veranderd...
2006
http://i.imgur.com/qYAXK7bl.png
Zoals je kan zien is dit al enkele jaren oud. Van de 11e doctor was nog geen sprake, zelfs de 10e doctor had nog geen volledig seizoen gespeeld! De website bestond uit fan fictions, gallerijen, guides en links. Vooral op vlak van gallerijen en fanfics is er veel veranderd de voorbije jaren. Zoals te zien is op de prehistorische website werden toen nog geen screencaps geupload, althans niet in de hoeveelheden dat ik daar nu mee bezig ben. 3 categorieen: Wallpapers, avatars en... David Tennant! Jep, volgens mij was onze vorige eigenaar een grote whovian maar nog een grotere fan van Tennant.
Well, I can't blame her.

2007-2010
In de Wayback machine zijn er geen gegevens van deze jaren. De website is wel gecached, maar geen CSS files of dergelijke worden gelinkt, dus ziet alles er heel slecht uit...

2011
http://i.imgur.com/MuHURH3l.png
We springen naar 2011, naar de eerste moment waar the way back machine z'n werk goed gedaan heeft: 15 juni 2011. Van helemaal wit naar helemaal zwart, maar je ziet al wel enkele dingen die ook te vinden waren in het design van de site toen ik 'm overnam, enkele maanden geleden: de rood-blauwe titels, de ontwerpen van de updates, ...
De header en de footer komen er wel niet door, al ligt dit waarschijnlijk ook aan TWBM. The big picture is wel daar.

Op 30/10/2011 zie ik de volgende update voorbij komen:
30/10/2011 - As I'm currently running out of space on my server I've had to make the tough choice to remove all Torchwood and SJA screencaps & graphics. They'll still be there for the next couple of weeks, and I'll make them available for download as complete series via MegaUpload. Once they've been removed from here, I may add them to my other screencap site (Random Caps) at a later date. Sorry for any inconvenience but I had to remove something and the site was originally intended for Doctor Who only.
Jep, alle Torchwood en Sarah Jane Adventure episodes hebben ooit online gestaan, maar zijn er enkele jaren geleden af gemoeten. Door de verhuis naar mijn eigen server is er dus plek genoeg en heb ik élke aflevering (een kleine 100 afleveringen) opnieuw kunnen cappen. Aangezien ik een échte tweaker ben heb ik dat uiteraard geautomatiseerd, maar daarover later meer :D

2012
http://i.imgur.com/rVvlEcsl.png
Dit is 'm. De website zoals ik 'm heb overgenomen. De website zoals hij van 3 januari tot enkele dagen terug is geweest. Je kan enkele elementen zien uit de vorige layout, maar ook totaal nieuwe dingen, zoals de header en de footer.
Onderaan de pagina zie ik wel iets staan wat mij, als webdeveloper, even liet lachen (=wat harder uit m'n neus blazen dan gewoonlijk).
http://i.imgur.com/gbVmA92.png
Het is niet zo lang geleden, maar in mijn hoofd was 2011 echt nog wel een jaar waar IE6 nog wat marketshare had :p Soit, I'm probably wrong...

2014
Jep, ook een linkje naar de versie van de dag dat ik Sharon een e-mail stuurde met de vraag of ik de website zou kunnen overnemen. Hoe ik op de website uit kwam? Geen idee. Maar sindsdien ben ik wel een dagelijkse bezoeker ;)


Soit, genoeg ge-time-waybacked-traveled! Ik heb dus een nieuw logo en design ontworpen.
Ik had een logo nodig dat ik kon gebruiken in m'n avatar/cover voor facebook en twitter, en ik had enkel de header waarin het logo stond. Ik had echter geen font-naam, psd file, of dergelijke dus was een nieuw logo maken het enige wat nog kon.
http://i.imgur.com/4gn1ZN3l.png
(wit lijntje linksonder zit er omdat het een screenshot is van m'n header/menu op de website zelf :p)
Ik ben gegaan voor een 'flat' design aangezien dat toch wel een van de definities is van het internet tegenwoordig, maar ook voor een herkenbaar object uit de Doctor Who serie: de lamp van de Tardis. Om even de oude header te gebruiken om het aan te duiden: http://i.imgur.com/dbOkMKk.png.
Qua design ben ik meegegaan in die lijn. Het is echter wel verder gebouwd op de oude layout aangezien ik de bestaande bezoekers niet te hard wilde afschrikken. Daarom ben ik gebleven bij het blauw/wit/donkerrood kleurschema.


Nieuwe Screencaps-gallerij en Screencap-tooltje
De website gebruikte Coppermine om de screencaps en foto's aan bezoekers te tonen. Persoonlijk heb ik echter geen goede ervaring, en leek het me ook wat overdreven om in deze situatie te gebruiken. Daarbij ben ik als PHP-ontwikkelaar ook eerder geneigd om zulke dingen zelf te maken: Wat je zelf doet, doe je meestal beter! (Dat geld niet in alle gevallen, maar hier wel geloof ik)
Nu zijn er dus 3 pagina-views: de categorieën, de categorie zelf, het album en elke screencap individueel. Simpel scriptje van net geen 200 regels code, en het ziet er ook nog 10 keer zo goed uit dan die Coppermine gallerij. Daarbij kan ik nu gebruik maken van 1 header en footer file, terwijl dit bij coppermine apart was. The Horror...

Om Screencaps te maken heb ik echter ook een tooltje ontwikkeld: de Sonic Biro Capper.
http://i.imgur.com/xblAX5ll.png
De software gebruikt ffmpeg om de screenshots te maken.
De eerste, ScreenCapper.exe heeft een grafische interface en hiermee kan je 1 aflevering per keer mee maken.
http://i.imgur.com/3414qTPl.png
Echter, bij ScreenCapperMulti.exe kan je gewoon een map ingeven, veel handiger als je hele seizoenen wilt cappen. Dit alles via de command line. Oh I love programming :p
Beide tooltjes zijn gemaakt in C#. (the only language I know to programm such things :( Al krijg ik nu op school wel java :D )
In feite zit alle magic wel in de ffmpeg.exe. Mijn software 'maakt' enkel het commando en geeft het door aan ffmpeg.exe, die maakt dan op zijn beurt elke 15 seconden een screencap en slaat deze op als /caps/episodenaam/000.jpg.

Nieuwe avatar pagina
Jep, geen enkele pagina is gespaard gebleven! De avatar-pagina's waren schandalig onoverzichtelijk gecodeerd. Elke avatar was met de hand erin gezet: géén php, maar pure HTML.
Nu heb ik avatar.php welke simpelweg de /avatars/ map scant en dit alles in een mooie grafische interface giet: lang leve programmeertalen. Alles wat ik nu hoef te doen om avatars toe te voegen is ze in de juiste map te uploaden.

Nieuwe wallpaper pagina
Ook de wallpaperspagina waren in dezelfde manier gemaakt als de avatars: pure html. :'(
Hiervoor heb ik een iets uitgebreidere pagina voor gemaakt: elke wallpaper heeft een titel en tags en krijgt een eigen pagina. Op de wallpaperpagina zelf wordt dan gelinkt naar verschillende versies van de wallpaper. Ik upload echter maar 1 HD versie, en de rest wordt automatisch herschaalt.

code:
1
RewriteRule ^wallpaper/([0-9]+)/([0-9]+)/(.*)/?$ thumb.php?w=$1&h=$2&src=graphics/wallpaper/$3 [NC,L]



Nieuwe header & footer
Dat wat het hardst opvalt zou ik nog bijna vergeten: de header en de footer.
De nieuwe header bestaat eigenlijk gewoon uit twee blauwe lijnen met in het midden in de ene blauwe lijn ons logo, en in de andere blauwe lijn het menu. De rest spreekt voor zich denk ik. In de footer heb ik dan een facebook-knopje toegevoegd. (Een twitter-account was er al, maar de facebook page bestaat nu twee dagen).


Zo ik denk dat ik alles zowat heb verteld, anders maak ik binnen een paar weken wel een nieuwe blogpost.
Even voor mensen die toevallig m'n robot-blogposts missen: Ik heb de deadline voor FACTS gemist (dit weekend, lukt me dus nooit) aangezien ik het best druk heb met school momenteel: de deadline is verplaatst naar maart/april 2015 (Antwerpcon)! Maar dus: het project zit niet in de vriezer, enkel in de ijskast dus er zullen nog enkele posts van volgen.
Ook over m'n NUC volgt er in de toekomst nog een post, maar het is wat druk met school en over die NUC praten (én het interessant houden) is wreed moeilijk :p

Soit, tot de volgende!
Leave a comment and make my day! :D