SPATIE | Updates

Focus up [Recent werk]

Thu, 15 Mar 2012 00:00:00 +0100

Het onderzoeksbureau Focus up uit Antwerpen bestelde bij ons een nieuw webdesign, logo en huisstijl. De website is meertalig, responsief en tevens de ingang naar online enquête-software die ook de huisstijl meekreeg.

http://focusup.be

[spatie.be →]

puls architecten [Recent werk]

Wed, 01 Feb 2012 00:00:00 +0100

Het webdesign voor Puls architecten uit Antwerpen maakten we een aantal jaren geleden nog in Flash.

We kregen de vraag om hun huisstijl te herbekijken en de website te vernieuwen. De site is nu zelf te beheren door Blender CMS, en door af te stappen van Flash worden ook iPad en iPhone ondersteund. Het idee is om in 1 pagina het volledige werk te kunnen bekijken. Wie uit een bepaalde sectie meer wil zien, kan de pagina ter plekke doen groeien.

http://pulsarchitecten.be

[spatie.be →]

Util.be update [Recent werk]

Sat, 10 Dec 2011 14:22:32 +0100

De website voor het struktuurbureau Util uit Brussel werd omgebouwd naar een site die volledig door henzelf te beheren valt door ons Blender CMS. De site maakt meteen ook gebruik van een nieuwere techniek om een lettertype in te sluiten, zodat bezoekers ook het huisstijl lettertype te zien krijgen.

Meer van util

[spatie.be →]

VUB TTI [Recent werk]

Tue, 01 Nov 2011 00:00:00 +0100

Voor de Vrije Universiteit Brussel maakten we het webdesign en CMS voor de afdeling Technology Transfer Interface. De website kreeg een kalender en afgeschermde sectie voor onderzoekers.

De site behaalde het anysurfer-label, een keurmerk voor toegankelijke websites.

http://vubtechtransfer.be

[spatie.be →]

Betty Van der Voort [Recent werk]

Thu, 15 Sep 2011 00:00:00 +0200

We ontwierpen voor schilderes Betty Van der Voort een portfolio website om haar werk online tentoon te stellen.

De site herschaalt zich in kleinere browservensters door een responsive design, zodat mobiele gebruikers een aangepaste layout te zien krijgen.

bettyvandervoort.com

[spatie.be →]

Researchpark Zellik [Recent werk]

Thu, 07 Jul 2011 17:59:04 +0200

Voor het Researchpark in Zellik bouwden we een overzichtelijke website met een geografisch overzicht van de gevestigde bedrijven, en bijhorende detailfiches die door de parkbeheerder zelf kunnen worden geplaatst en aangepast in Blender CMS.

De locaties worden weergegeven op Google Maps, en de moderne browsers krijgen er geanimeerde wolkjes bovenop.

Technisch maakt de site gebruik van CSS3 animaties voor de wolkjes, en een responsive design zodat op kleinere (mobiele) schermen de content aangepast wordt weergegeven.

[spatie.be →]

Kinderhoogdag [Recent werk]

Fri, 01 Apr 2011 00:00:00 +0200

In opdracht van Artforum VZW ontwierpen we een nieuw logo, huisstijl en drukwerk voor het kinder-cultuurfestival 'Kinderhoogdag' — een reeks van 12 dagen in verschillende Brabantse steden.

Naast traditionele toepassingen als posters, flyers, ballonnen en slingers, werd er ook een uitnodiging ontworpen met een uitdrukbare vorm waarmee de kinderen zelf een doosje kunnen plooien. Op de hoogdag zelf kan dan met deze doosjes een gigantisch stadsplan worden gebouwd.

We bouwden ook de website met het programma, met een kleine verrassing in de hoofding op www.kinderhoogdag.be

[spatie.be →]

Toon De Clerck [Recent werk]

Mon, 14 Feb 2011 10:17:03 +0100

Webdesign voor fotograaf Toon De Clerck uit Turnhout met een selectie van zijn werk, en een eenvoudige slideshow die ook via het toetsenbord bediend kan worden.

De site is voorzien van een 'responsive design', waarbij de layout zich aanpast aan mobiele apparaten met kleinere schermen. Je kan dit effect ook zien bij het herschalen van je browservenster (in moderne browsers als Chrome, Safari of Firefox).

[spatie.be →]

Resilient [Recent werk]

Fri, 04 Feb 2011 10:50:37 +0100

Ontwerp van een nieuw logo en website voor Resilient, een team van Microsoft .net ontwikkelaars uit het Brusselse. Het logo is opgebouwd rond een elastische zuil, die vanuit het juiste perspectief gelezen wordt als een R. Het bestaat in een zwart-wit versie, en een 'glossy' versie voor toepassingen op het scherm.

Meer info op http://www.resilient.be.

[spatie.be →]

Designcenter De Winkelhaak [Blog]

Fri, 24 Dec 2010 13:01:24 +0100

Half december verhuisden we van ons kantoor op Vleminckveld naar het Designcentrum De Winkelhaak, op de derde verdieping. De Winkelhaak is naast een exporuimte en co-working bar ook een bedrijvencentrum voor ontwerpbureau's en architecten.

Enkel ons adres wijzigt dus:
SPATIE bvba
Designcenter De Winkelhaak
Lange Winkelhaakstraat 26
BE-2060 Antwerpen

Je vindt een aangepast kaartje op onze contactpagina.

door willem

[spatie.be →]

De Cijferij [Recent werk]

Mon, 15 Nov 2010 06:00:00 +0100

Ontwerp van een nieuw logo, visitekaartjes, belettering en website voor 'De Cijferij', een statistisch onderzoeksbureau uit Antwerpen.

Je vindt de site op http://decijferij.be.

[spatie.be →]

Marieke Vansteenbeeck [Recent werk]

Mon, 25 Oct 2010 10:09:46 +0200

Voor architect Marieke Vansteenbeeck uit Lier bouwden we een portfolio website die ze zelf kan beheren binnen de browser.

Op het eerste zicht eenvoudig, maakt de website gebruik van een aantal actuele webtechnieken:

Web font: een niet-standaard lettertype wordt in de browser geladen. Alle opgemaakte tekst is hierdoor selecteerbaar, en vb. niet verpakt als afbeelding, zodat de site ook voor zoekmachines duidelijk te lezen valt.

Responsive design: in een moderne browser als Safari, Chrome of Firefox past de layout van de site zich aan naarmate je het venster verkleint, om horizontaal scrollen te vermijden — vooral duidelijk in de overzichtspagina van 'Projecten'. Ook mobiele toestellen als iPhone of iPad profiteren van deze aangepaste layout.

CSS animations & transformations: in een browser als Safari zie je elke pagina 'infaden', en op de contactpagina krijg je een 3D animatie te zien bij het openen van de landkaart.

Content Management: de volledige site valt te beheren door de architect zelf in een op maat gemaakte administratiemodule – het door ons ontwikkelde CMS Blender.

[spatie.be →]

Vanhoutte Beyl [Recent werk]

Wed, 15 Sep 2010 10:55:25 +0200

Ontwerp van en nieuw logo, sjablonen en bijhorende strakke website voor architecten Vanhoutte & Beyl uit Veurne.

De site bevat projecten en nieuwtjes, die door de architecten zelf beheerd worden binnen Blender.

[spatie.be →]

Durga filmfestival [Recent werk]

Fri, 06 Aug 2010 15:48:29 +0200

Op basis van het grafisch ontwerp van Fenna Zamouri bouwden we begin augustus –tegen de klok– de website voor de 4de editie van het Durga Filmfestival, met links naar fotomateriaal en trailers.

Een mooie affiche – ook inhoudelijk!

[spatie.be →]

Blender CMS [Recent werk]

Wed, 09 Jun 2010 10:20:56 +0200

Introducing Blender CMS... Met de nodige trots stellen we je vandaag graag ons eigen CMS voor dat het afgelopen jaar intern werd ontwikkeld.
Het laat ons toe om interactieve sites te bouwen, précies zoals wij het willen.

Lees er meer over op de uitgebreide Blender-sectie op onze website.

[spatie.be →]

C-mine [Recent werk]

Tue, 18 May 2010 09:58:15 +0200

In Genk wordt een oude mijnsite opgewaardeerd tot nieuw cultuurcentrum C-mine. De huisstijl van dit centrum is reeds uitgewerkt, en wordt oa. opgebouwd rond een gele lont. We deden mee aan de aanbesteding van de communicatie voor 2010-11, en hierbij werd een voorontwerp gevraagd voor de folder bij de opening. Jammer genoeg geen selectie...

[spatie.be →]

Gratis wi-fi! [Blog]

Tue, 04 May 2010 14:45:01 +0200

There's no such thing as a free meal. Maar qua gratis internet op het Mechelseplein ligt dat toch wel even anders. Want dat hebben we vanaf vandaag echt kosteloos gemaakt.

Handig voor onze klanten: nooit meer gedoe met kabels en paswoorden. En de terrassende medemens mag ineens mee profiteren. Laptop, iPad of smartphone: maakt niet uit, iedereen welkom.

Het gratis draadloze netwerk —www.spatie.be public— wordt in de lucht gehouden door een Netgear-router die we uitrustten met de gratis open-source firmware DD-WRT. Deze firmware laat ons toe om aan iedere gebruiker eerst een welkomspagina te laten zien (in het jargon wordt dit een captive portal genoemd), alvorens verder te kunnen surfen. Beetje reclame maken zeg maar.

En voeg u een beetje op dat wereldwijde web, dat we geen klachten horen.

door jef-freek

[spatie.be →]

Bob Boogaers [Recent werk]

Sat, 01 May 2010 09:36:25 +0200

Advocaat Bob Boogaers uit Turnhout liet door ons zijn logo en huisstijl ontwerpen. De online aanwezigheid beperkt zich voorlopig tot de publicatie van zijn naamkaartje.

[spatie.be →]

M10 architecten [Recent werk]

Thu, 22 Apr 2010 10:51:14 +0200

Voor M10 architecten uit Lille maakten we een portfolio website op basis van een bestaande huisstijl: zwart & blauw als hoofdkleuren, en een specifiek lettertype met elke letter als bouwblok, een woord als een huizenrij. Per sectie komt dit lettertype onderaan terug.

De site wordt momenteel opgevuld door het bureau zelf: ze beheren hun projecten, afbeeldingen en bijschriften in een afgeschermd gedeelte op de website. Van de opgeladen foto's wordt automatisch een zwart-wit versie gegenereerd, voor het mouse-over effect op de thumbnails.

[spatie.be →]

Knock knock [Blog]

Thu, 22 Apr 2010 10:27:30 +0200

Na de ontwikkeling van een website testen we eerst zelf alle functionaliteiten uit op verschillende systemen vooraleer we ons werk aan de klant presenteren. Het is onvermijdelijk dat een klant bij gebruik van de site toch nog op een probleem stoot. Zo'n probleem kan tal van oorzaken hebben; aan de basis ligt meestal een combinatie van:

browser (hallo Internet Explorer 6)
geïnstalleerde plugins in die browser
het gebruikte besturingssysteem
allerlei (schermresolutie, provider, ...)

Als technologie-liefhebbers hebben we zelf geen moeite om dingen als browserversie, flashversie, schermresolutie etc... op te zoeken. Voor onze minder technisch aangelegde klanten is het opzoeken van dat soort informatie minder evident. Om onze klanten het gemakkelijk te maken om informatie omtrent hun computer door te geven, maakten we deze pagina op onze website:

→ SPATIE Tools

Op die pagina wordt een heel pak informatie over je computer gedetecteerd. Deze gegevens zijn voor ons zeer nuttig bij het oplossen of reproduceren van een probleem. Om deze info aan ons door te geven moet je op dezelfde pagina gewoonweg je e-mailadres ingeven.

door freek

[spatie.be →]

Willems Tools [Blog]

Wed, 07 Apr 2010 08:45:16 +0200

Als laatste in de reeks over de gebruikte tools komt Willem –SPATIE's ontwerper–, die zich alvast aansluit bij de keuze van Jef en Freek voor o.a. Textwrangler, Netbeans, Navicat, Google Docs, Transmit en Evernote.

Ontwerpen

Dat ik de Creative Suite 4 (Design Premium) van Adobe gebruik – Photoshop en Illustrator op kop – is geen grote verrassing. Een echt alternatief is er wat mij betreft niet.
Voor drukwerk of handleidingen gaat Indesign open, en Acrobat Pro bij het bewerken van pdf's.
Dreamweaver verliest sinds de invoer van versiecontrole (SVN) snel terrein aan het open source pakket Netbeans (dat ook Freek gebruikt om te ontwikkelen), en met Flash worden vooral specifieke onderdelen zoals webbanners gebouwd, maar veel minder nog volledige websites.
En Fireworks staat daar maar te staan. Ik heb er amper mee gewerkt, het nooit grondig uitgeprobeerd maar ook nooit gemist.
Benieuwd naar CS5!

Adobe CS4: 2.093 €, upgrade vanaf 785€

Browsen

Safari op OSX is mijn dagdagelijkse browser: hij heeft een uitstekende ondersteuning voor nieuwe webstandaarden (html5, css3, typografie), hij is snel en betrouwbaar, en hoeft geen 10 toolbars onder elkaar.
Je kan in Instellingen een 'ontwikkel'-menu aanzetten, waarmee je achter de schermen kan kijken als je een ontwerp begint te testen in je browser. Heel handig.
Zowel boven als onderaan is hij compacter als eerste eredame Firefox: nadruk op de inhoud dus, iets waar Google Chrome het ook goed doet. Met Safari voor Windows heb ik geen ervaring, maar het klinkt wel lichtjes raar.

Ik zou van de gelegenheid nog gebruik willen maken om de groetjes te doen aan Internet Explorer: een verschrikkelijke browser. Als gewone surfer zal je het hopelijk niet merken, maar IE is een ramp met open webstandaarden.
Met deze test kan je bijvoorbeeld een idee krijgen hoe goed je browser deze standaarden volgt.
Safari en Chrome, beiden op dezelfde technologische leest geschoeid, zitten hier al een tijdje op 100%. Dikke vriend Internet Explorer in zijn huidige versie (IE8) op 20%. Voor de preview van komende versie pakt Microsoft uit met 55% als ware het baanbrekend.

Jammer genoeg staat het onding standaard op een massa pc's, en neemt niet iedereen de moeite om iets anders te installeren. We zijn dus verplicht om er voor zorgen dat onze sites ook in Internet Explorer werken. Als ik 's avonds slechtgezind naar huis ga wegens veel tijd verloren, is de kans groter dan 55% dat het aan IE lag.

Drie goede gratis browsers: Safari, Firefox, Google Chrome

Testen

Om op een Mac toch Internet Explorer te kunnen testen, gebruiken we Parallels. Met dit pakket installeer je een virtuele computer bovenop je bestaande Mac, of anders gezegd: Windows open je in een apart venstertje binnen OSX.
De opstelling is hier nog iets complexer: er staat een Mac Mini als server, met daarop Parallels met Windows 7 & XP.

Vanop de laptop connecteer ik dan via Cord naar deze virtuele servers en neem van op afstand een Windows scherm over om daarin IE te openen - of kom anders eens langs, dan laat ik het zien.

Samengevat: op één server kunnen meerdere besturingssystemen en browserversies staan, we hoeven dus geen extra PC's in huis te halen.

Parallels Desktop: 69,99 €
Cord: gratis

Rusten

Wat kleinere toepassingen om bovenstaande miserie te vergeten:

Facebook Notifications: kleine verklikker die bovenaan de taakbalk resideert. Probeer maar eens rustig door te werken zonder te weten wat er gebeurt in de wereld.
Gratis

Tweetie: eenvoudige maar propere Twitter-toepassing.
Gratis, inclusief advertenties

Google Picasa: sinds kort probeer ik hiermee mijn digitale foto's te beheren, en dat bevalt me op het eerste zicht wel. Je kan er eenvoudiger met de normale mappenstructuur werken, foto's taggen en ze op een kaart lokaliseren.
Gratis

EyeTV: thuis kijk ik naar Eén of Canvas op de laptop met een kleine DVB-T ontvanger. Met het bijgeleverde EyeTV kan je een tv-gids ophalen, programma's afspelen en live pauzeren, of vooraf programmeren en opnemen.
79,95 €

Last.fm Scrobbler: wat ik afspeel in iTunes wordt hiermee doorgestuurd naar www.last.fm. Na verloop van tijd fijn voor statistieken en suggesties.
Gratis

Tot zover, ik was willemvb.

door willem

[spatie.be →]

Jefs Tools [Blog]

Fri, 26 Mar 2010 09:18:57 +0100

In deze blogpost de tools die Jef - SPATIE's organisator en projectleider - gebruikt om de werkdag door te komen. In een vorige blogpost kon je ook de tools van Freek al bekijken.

Adobe Reader

Site: Adobe Reader
Prijs: gratis

Ik ben geen fan wegens te traag en zonder geldige reden 200Mb groot. Maar als het er echt toe doet, toont het pdf bestanden wel accurater dan de standaard Preview.app van Apple. Dat heeft dan vooral met de fonts te maken en of die al dan niet embedded zijn. In Safari wil je vooral niet Acrobat gebruiken want het duurt een eeuwigheid vooraleer die plug-in geladen is. Velen zitten hier echter mee opgezadeld en weten niet hoe dit te deactiveren, zodus: in Acrobat Reader naar de Preferences gaan, 'Internet' selecteren en daar vervolgens 'display PDF in browser using...' uitvinken. Toedeledoki!

Billings

Site: Billings
Prijs: €30

Het kloppend hart van Spatie. Ik maak er offertes mee, hou de actieve projecten in de gaten, maak facturen op en het vertelt me wie er al dan niet op tijd betaalt. Rapporten en statistieken in alle maten rollen er vlotjes uit. Zonder Billings stort mijn wereld in. De bijhorende database wordt dan ook constant onsite, offsite, online en offline geëncrypteerd gebackupped. Maar alles kan beter: templates aanpassen mag heel wat meer gebruiksvriendelijk worden, tijdsregistratie ook voor mijn collega's aub, en de gecreëerde pdf bestanden mogen heel wat kleiner en copy/paste vriendelijk worden. Starten maar!

iBank

Site: iBank
Prijs: $60

Hier houd ik alle bankverrichtingen gedetailleerd in bij. Lastige vragen van de boekhouder worden dankzij iBank onmiddellijk gepareerd met een sluitend antwoord. Inkomsten en uitgaven worden netjes gesorteerd per categorie dus ik heb op elk moment een correct overzicht van de situatie. Het vergt wel wat discipline om alles gestructureerd in te geven want alles moet dus nog manueel gebeuren. Ik heb de indruk dat Amerikaanse banken toch al heel wat verder staan qua integratie met software. Ik krijg van mijn bank enkel wat schrale pdf bestanden. Die moet ik vervolgens ook nog eens afdrukken want een boekhouding is in België van papier.

GraphicConverter

Site: GraphicConverter
Prijs: €30

A poor man's Photoshop. Eigenlijk zijn hier tegenwoordig moderner alternatieven voor zoals Acorn en Pixelmator, maar ik gebruik GraphicConverter al toen Macs nog beige waren. Ik ken het door en door en het draait erg snel. Als GC een beeld niet kan openen dan is het bestand corrupt, zo simpel is dat.

LittleSnapper

Site: LittleSnapper
Prijs: €30

Een programma om screenshots te nemen. Laat ik eerst even de shortcuts meegeven die standaard in OSX voorzien zijn:

cmd + shift + 3 = screenshot van het hele scherm, het bestand staat steeds op je bureaublad
cmd + shift + 4 = je krijgt een kruisje op je scherm waarmee je een kader kan trekken rond een specifiek onderdeel op het scherm
cmd + shift + 4 en vervolgens op spatie drukken: de cursor verandert in een fototoestel en je kan nu een object (venster, dialoogbox, menu...) selecteren

-> voeg in deze shortcuts ook nog ctrl toe en het screenshot zit in het geheugen klaar om ergens geplakt te worden.

LittleSnapper zorgt ervoor dat je die screenshots kan aanpassen door bepaalde onderdelen te highlighten en aantekeningen te maken. Het doet dat bovendien op een visueel erg aantrekkelijke manier. Erg handig voor een handleiding of presentatie.

Microsoft Office

Site: Microsoft
Prijs: €140

Dit hoeft geen voorstelling. Mijn collega's rooien het zonder, maar ik kan het niet missen. Al is het maar om zonder problemen documenten te kunnen uitwisselen met klanten, ongeacht of die nu Mac of pc gebruiken. Enkel Excel gebruik ik eigenlijk actief.

Navicat Lite for MySQL

Site: Navicat Lite for MySQL
Prijs: gratis

Een gratis app waarmee je aanpassingen kan doen in online databases, of zoiets. Eerder een noodzakelijk kwaad want ik gebruik het enkel wanneer mijn collega's vinden dat ik die gevraagde wijziging eigenlijk zelf ook wel kan uitvoeren. Toegegeven, dat lukt ook wel meestal.

Handbrake

Site: Handbrake
Prijs: gratis

Af en toe moet ik een video conversie uitvoeren en dan is Handbrake mijn Zwitsers zakmes. Je kan enorm veel voorkeuren instellen maar dankzij de standaard ingebouwde presets bereik je meestal je doel wel. Ik gebruik de 64-bits versie want 64>32 en meer is altijd beter.

Spotlight

Site: Spotlight
Prijs: onderdeel van OSX

Dit is uiteraard geen echt programma, maar probeer maar eens een dag zonder door te komen.

Things

Site: Things
Prijs: €50

Een programma dat je helpt om de principes van Getting Things Done (GTD) te realiseren. Eenvoudig gezegd is het een gestructureerde to-do lijst. Je kan ook je inbox gebruiken als takenlijst maar dan ben je eigenlijk niet goed bezig. Uit je inbox halen en inplannen is de boodschap!

TextWrangler

Site: TextWrangler
Prijs: gratis

Een teksteditor zoals de standaard meegeleverde en geheel volgens Apple logica genoemde 'Teksteditor'. Alleen heeft TextWrangler een hoop extra functies zonder echter zijn eenvoud te verliezen. Gestructureerde tekstbestanden krijgen handige kleurtjes zodat die structuur net duidelijk wordt. Hiermee kan ik zelfs html, xml en hosts files aanpassen.

Transmit

Site: Transmit
Prijs: $30

Een FTP programma zoals er wel meer bestaan, alleen biedt deze net dat tikkeltje meer: duidelijke interface, favorieten die syncen, gebruiksvriendelijk én betrouwbaar.

Google Docs

Site: Google Docs
Prijs: gratis

Niet echt een programma dat lokaal op je computer draait, maar dat gaat in de toekomst ook minder en minder van belang zijn. Kort samengevat: MS Office maar dan online. Belangrijkste voordelen voor mezelf:

documenten intern delen
automatisch bewaren
alles overal beschikbaar (ook mobiel)
geen opstarttijden

Windows 7 Professional

Site: Windows 7 Professional
Prijs: €300

Onze websites moeten perfect kunnen draaien op de 2 meest recente versies van Internet Explorer, Firefox, Safari en Chrome. Eén van die vier is soms een lastige klant en zodus is Windows absoluut noodzakelijk voor het nodige testwerk.

door jef

[spatie.be →]

Vleminckveld 76 [Blog]

Wed, 17 Mar 2010 12:30:32 +0100

In plaats van een mooie bronzen gevelplaat hebben we als experiment aan onze voordeur een QR-code geïnstalleerd — een geëvolueerde streepjescode — op een proper stukje arduin.
De code bevat een link naar info over onszelf, met een klein cadeau voor mobiele surfers die op het terras van de Kapitein Zeppos blijven hangen.

Ontcijferen kan vb. met volgende software:

iPhone

BlackBerry

Normaal standaard geïnstalleerd, via Blackberry messenger
Up Code
BeeTagg

Symbian

Up Code

Android

Barcode Scanner (downloadbaar in de market)

door willem

[spatie.be →]

Freeks tools [Blog]

Fri, 12 Mar 2010 22:12:57 +0100

Een goede programmeur moet goede tools hebben om te kunnen ontwikkelen.
In deze blogpost licht Freek –SPATIE's webontwikkelaar & programmeur– zijn meest gebruikte programma's kort toe.

Snow Leopard

Site: http://www.apple.com/benl/macosx/
Prijs: zit gebundeld bij alle nieuwe macs, een upgrade kost 29 EUR

Vooraleer de programma's voorgesteld worden, leek het me gepast om ook m'n favoriete OS te vermelden. Al vele jaren ben ik fan van het grote gebruiksgemak en het gevoel voor esthetiek van Mac OSX. Features als Time Machine, Exposé, allerhande fijne hulpprogramma's en ook de gehele zen-uitstraling van het systeem zorgen ervoor dat er qua OS voor mij geen alternatief is (en er ook niet hoeft te zijn).

Firefox

Site: http://www.mozilla-europe.org/en/firefox/
Prijs: gratis

De reden waarom ik Firefox boven een andere browser verkies is de fantastische extensie Firebug. Met die extensie kunnen alle details van een serverrequest en serverantwoord gecontroleerd worden. In andere browsers heb je ook inspector-achtige functies maar die van Firebug vind ik het gebruiksvriendelijkst.

Netbeans

Site: http://www.netbeans.com/
Prijs: gratis

PHP ontwikkeling doe ik voornamelijk in Netbeans. Dit programma zit werkelijk bomvol features die me als programmeur echt gelukkig maken: syntax hightlighting, code completion (vooral als je object geörienteerd werkt helpt Netbeans je een pak sneller code schrijven), phpdoc ondersteuning, Subversion integratie, ingebouwde help van de standaard php-functies, het doorklikken naar de definitie van een functie, ... het is echt teveel om op te noemen. Dit programma is volledig gratis en wordt actief ontwikkeld: om de zoveel maanden komt er een nieuwe versie uit.

Versions

Site: http://www.versionsapp.com/
Prijs: 39 EUR

In Netbeans kan je makkelijk een project in en out-checken. Voor alle andere Subversion-taken (zoals vergelijkingen tussen vorige revisies maken, kijken wie de laatste keer wijzigingen heeft aangebracht, uitlezen en wijzigen van svn properties), schiet Netbeans wat tekort. Versions is een prachtig vormgegeven Subversion-client waarmee je je Subversion-repository zeer gemakkelijk kan beheren.

SQLEditor

Site: http://www.malcolmhardie.com/sqleditor/
Prijs: $79

In een standaard phpMyAdmin kan je zeer gemakkelijk nieuwe tabellen en velden in die tabellen aanmaken. Voor complexe databases kan je best eerst even nadenken over de gewenste structuur vooraleer je de tabellen aanmaakt. SQLEditor kan daarbij helpen. Je kan op een hele gemakkelijke manier een ERD tekenen: nieuwe tabellen definiëren, relaties leggen, veldtypes instellen of wijzigen is zo gebeurd. Als je klaar bent met de databasestructuur kan je met de SQL-statements die SQLEditor genereert de uiteindelijke fysieke tabellen aanmaken. Je hoeft ook niet altijd vanaf nul beginnen, SQLEditor kan ook de structuur van een bestaande database uitlezen en je hiervan de structuur visueel weergeven.

Navicat

Site: http://navicat.com/
Prijs: $179 (er is ook een gratis lite-versie beschikbaar)

Navicat is een tool waarmee je databases kan beheren. Je kan meerdere databases tegelijkertijd openen en er wijzigingen aanbrengen. De structuur en de inhoud van de tabellen kunnen bekeken en gewijzigd worden. Uiteraard kunnen er losse queries uitgevoerd worden. Ook zeer handig zijn de uitgebreide import- en exportopties.

Textwrangler

Site: http://www.barebones.com/products/TextWrangler/
Prijs: gratis

Om snel een los bestand aan te passen is Textwrangler een essentieel programma. Handige features voor de webdeveloper zijn de html- en php-highlighting, het weergeven van lijnnummer en de mogelijkheid om complexe search (en replaces) te doen met behulp van regular expressions.

Evernote

Site: http://www.evernote.com/
Prijs: gratis

Het is een warrige wereld binnen het hoofd van de programmeur. Evernote helpt om orde in die chaos te scheppen. Je kan Evernote zien als het ultieme notitieblokje. Een notitie kan vanalles zijn: een tekst, een brok html, een tabel, een afbeelding, ... Notities terugvinden kan aan de hand van de inhoud van de notitie of door tags die je aan een notitie kan hangen. Een zeer fijne feature is de automatische synchronisatie met bijvoorbeeld een iPhone zodat je je ultieme notitieboekje altijd bij de hand hebt.

NetNewsWire

Site: http://www.newsgator.com/individuals/netnewswire/default.aspx
Prijs: gratis, er is ook een betaalde versie die geen reclame weergeeft

Er zijn zoveel interessante sites op het net dat het moeilijk is om ze allemaal regelmatig te bezoeken. Een oplossing hiervoor is om je te abonneren op de RSS-feeds van de verschillende sites. NetNewsWire is een gebruiksvriendelijke RSS-reader waarmee je je feeds kan beheren. Bovendien kan het programma synchroniseren met Google Reader dat op zijn beurt kan synchroniseren met de NetNewsWire iPhone applicatie.

Overige

Verder heeft voor mij het leven geen zin zonder Launchbar, Transmit en Dropbox.

door freek

[spatie.be →]

Senspatie [Blog]

Tue, 09 Mar 2010 14:05:49 +0100

Vandaag na veel goede voornemens uiteindelijk onze eerste elektronische nieuwsbrief verstuurd, met een korte tussenstand van wat er gebeurd is de afgelopen periode.
Het blijft toch redelijk spannend om de laatste fouten eruit te halen, links te checken, en dan op 'Send' te drukken om hem te versturen naar een hoop mensen die waarschijnlijk al genoeg in hun mailbox krijgen.

Daarna erg boeiend om de statistieken ervan op te volgen. Dat gaat vrij ver: we zien effectief wie de e-mail bekeek, welke links het populairst blijken, of hoelang bezoekers van de nieuwsbrief nog rondhangen op de website (en dat kan misschien weer ontnuchteren).

Inhoudelijk deze keer:

De geboorte van Blender -het CMS waar we aan bouwen- en zijn eerste stappen in de wereld
Een hoop activiteit bij onze klanten uit de architectuursector.

Wie niet geabonneerd is, kan de nieuwsbrief alsnog bij ons nalezen.
Inschrijven kan door je e-mailadres achter te laten in de rechterkolom van onze blog, of onderaan onze homepagina. We proberen vanaf nu elk kwartaal een exemplaar uit te sturen, dus we vallen zeker niet elke week binnen, beloofd.

door willem

[spatie.be →]

Tags, tags, tags [Blog]

Thu, 04 Mar 2010 09:59:20 +0100

Het doel van een framework is om door hergebruik van code de kwaliteit van de oplossing te verhogen en de ontwikkelingstijd te verminderen. Een goede set van gemakkelijk te gebruiken en handige functies binnen een framework is onontbeerlijk wil de programmeur gelukkig blijven en tevreden kunnen gaan slapen.

Het probleem

Een van de veel voorkomende taken bij het bouwen van een website is het schrijven van allerhande html-tags. Bijvoorbeeld:

<a href="/foo/bar" class="bigLink">Linkje</a>
<img src="afbeelding.png" alt="mooie afbeelding" />
<h1>Hoofdstuktitel<h1>
<div id="mainDiv">Hello Div</div>

Uiteraard zouden we deze tags handmatig kunnen typen maar dat heeft een aantal nadelen:

je moet er op letten dat je geen quotes vergeet te zetten
je mag niet vergeten je tag waar nodig af te sluiten
het is niet netjes om bepaalde attributen leeg te laten
toekomstige uitbreidingen (bvb placeholder attribute voor input fields) wil je niet overal handmatig uitvoeren

De oplossing

Om deze probleempjes op te lossen maken we een klasse aan die deze zaken regelt. In z'n simpelste vorm ziet die er zo uit:

class TagGenerator {
    protected $attributes;
    protected $tagName;

    public function  __construct() {
        $this->attributes = array();
    }

    public function setTagName($tagName) {
        $this->tagName = $tagName;
    }

    public function  render() {
        $withClosingTagTags = array('a', 'div', 'span' , 'ul' ,'li', 'h1', 'h2','h3',
                                    'h4', 'h5', 'h6', 'table', 'td', 'tr', 'th', 'p', 'pre',
                                    'strong', 'i', 'b', 'em' , 'iframe', 'block', 'quote');
        $withClosingTag = (Utility::inArray($this->tagName, $withClosingTagTags) ? TRUE : FALSE);

        foreach($this->attributes as $name=>$value) {
            if ($value != '') {
               if (! ($name == 'value' AND $withClosingTag)) {
                   $attributeString .= $name . '="' . $value . '" ';
               }
            }
        }
        if ($withClosingTag) {
            $result = '<' . $this->tagName . ' ' . $attributeString . '>' . $this->attributes['value'] . '</' . $this->tagName . '>';
        }
        else {
            $result = '<' . $this->tagName . ' ' . $attributeString . '/>';
        }

        return $result;
    }

    public function setAttribute($name, $value) {
        $this->attributes[$name] = $value;
    }
}

De TagGenerator houdt de waarden van de attributen bij in array. Je kan items aan de array toevoegen met de setAttribute-functie. De render-functie genereert de uiteindelijke htmlstring. Met behulp van TagGenerator kunnen tags op deze manier gegenereerd worden:

$tag = New Tag();
$tag->setTagName('a');
$tag->setAttribute('href', '/foo/bar');
$tag->setAttribute('class, 'bigLink');
$tag->setAttribute('value' 'Linkje');
$html .= $tag->render();

$tag = New Tag();
$tag->setTagName('img');
$tag->setAttribute('src','afbeelding.png');
$tag->setAttribute('alt', 'mooie afbeelding');
$html .= $tag->render();

Je merkt dat we geen tags meer zelf moeten sluiten, de render functie weet welke tags zich moeten afsluiten in de vorm van <tag /> en welke in de vorm van <tag></tag>, quotes worden automatisch gesloten en lege attributen worden gefilterd in de render-functie.

De oplossing... revisited

In het gebruiksvoorbeeld hierboven zie je dat we nogal wat instructies nodig hebben om de tag te genereren. We kunnen deze klasse nog uitbreiden met een aantal zaken zodat we met minder regels code (programmeurs zijn lui, iedereen weet dat) toch hetzelfde resultaat bereiken.

Hier is de uitgebreide klasse:

class Tag {
    public static function create($tagName) {
        $instance = TagGenerator::getInstance();
        $instance->setTagName($tagName);
        return $instance;
    }
}

class TagGenerator {
    protected static $instance = null;
    protected $attributes;
    protected $tagName;

    public function  __construct() {
        $this->attributes = array();
    }

    public static function init() {
        return self::$instance = new self();
    }

    public function setTagName($tagName) {
        $this->tagName = $tagName;
    }

    public static function getInstance() {
        self::init();
        return self::$instance;
    }

    public function  __toString() {
        $withClosingTagTags = array('a', 'div', 'span' , 'ul' ,'li', 'h1', 'h2','h3',
                                    'h4', 'h5', 'h6', 'table', 'td', 'tr', 'th', 'p', 'pre',
                                    'strong', 'i', 'b', 'em' , 'iframe', 'block', 'quote');
        $withClosingTag = (Utility::inArray($this->tagName, $withClosingTagTags) ? TRUE : FALSE);

        foreach($this->attributes as $name=>$value) {
            if ($value != '') { 
               if (! ($name == 'value' AND $withClosingTag)) {
                   $attributeString .= $name . '="' . $value . '" ';
               }
            }
        }
        if ($withClosingTag) {
            $result = '<' . $this->tagName . ' ' . $attributeString . '>' . $this->attributes['value'] . '</' . $this->tagName . '>';
        }
        else {
            $result = '<' . $this->tagName . ' ' . $attributeString . '/>';
        }

        return $result;
    }

    public function setId($value) {
        $this->setAttribute('id', $value);
        return $this;
    }

    public function setName($value) {
        $this->setAttribute('name', $value);
        return $this;
    }

    public function setClass($value) {
        $this->setAttribute('class', $value);
        return $this;
    }

    public function setHref($value) {
        $this->setAttribute('href', $value);
        return $this;
    }

    public function setSrc($value) {
        $this->setAttribute('src', $value);
        return $this;
    }

    public function setTitle($value) {
        $this->setAttribute('title', $value);
        return $this;
    }

    public function setRef($value) {
        $this->setAttribute('ref', $value);
        return $this;
    }

    public function setWidth($value) {
        $this->setAttribute('width', $value);
        return $this;
    }

    public function setHeight($value) {
        $this->setAttribute('height', $value);
        return $this;
    }

    public function setBorder($value) {
        $this->setAttribute('border', $value);
        return $this;
    }

    public function setTarget($value) {
        $this->setAttribute('target', $value);
        return $this;
    }

    public function setValue($value) {
        $this->setAttribute('value', $value);
        return $this;
    }

    public function setAttribute($name, $value) {
        $this->attributes[$name] = $value;
        return $this;
    }
}

Een eerste belangrijke verandering is dat er een helperklasse Tag is bijgekomen. De klasse bevat een statische functie die een instatie van de taggenerator-klasse gaat aanmaken en teruggeven.

Een tweede verandering is dat we helperfuncties als setSrc, setTitle, ... hebben toegevoegd die telkens setAttribute aanroepen zodat we dat zelf niet meer hoeven te doen. Als een bepaalde helperfunctie voor een bepaald attribuut niet bestaat, dan kan je toch nog via setAttribute het attribuut zetten. vb. setAttribute('alt', 'alt value');

De derde wijziging zie je op het einde van alle set-Functies: ze geven nu allemaal zichzelf terug. Op deze manier gaan we aan method chaining kunnen doen.

En als laatste is ook de functie naam render() aangepast naar de magic method __tostring(), waardoor de het object zichzelf zal transformeren tot html string zodra het object als string gebruikt wordt.

Nu kunnen we tags op deze manier genereren:

$htmlString = 'Hier volg een link ' . Tag::create('a')->setHref('foo/bar')
                                                      ->setClass('bigLink')
                                                      ->setValue('Linkje');
                                                      
$htmlString = 'Een afbeelding ' .
                   Tag::create('img')->setSrc('afbeelding.png')
                                     ->setAttribute('alt', 'mooie afbeelding');

Doordat je de tag onmiddellijk concateneert met een string zal de tag zich transformeren naar een string. Je zou ook de tag in een variabele kunnen behouden. Dit heeft als voordeel dat het object dan wel een tagobject blijft en je kan er dan nog Tag-functies op loslaten.

Bijvoorbeeld:

$tag = Tag::create('a')->setHref('foo/bar')
                       ->setClass('bigLink')
                       ->setValue('Linkje');
$tag->setTarget('_blank');
$htmlString = 'Link met een target: ' . $tag;

De oplossing re-revisited

Uiteraard kan deze code nog verder uitgebreid worden. Je zou bijvoorbeeld kunnen controleren of bepaalde attributes wel zin hebben bij een bepaalde tag. Een attribute "target" heeft geen zin bij een tag "img". De setTarget-functie zou ook uitgebreid kunnen worden zodat enkel geldige targets als "_blank", "_parent", ... kunnen doorgegeven worden. Om de zaken simpel te houden is dit nu (nog) niet gebeurd.

Einde monoloog, start conversatie

Ons eigen CMS Blender maakt van deze klasse gebruik, maar bovenstaande code mag vrij gebruikt worden. Als je een bug ontdekt of een vraag hebt over de werking of een idee hebt waardoor deze code beter kan worden, dan kan je hieronder reageren.

door freek

[spatie.be →]

Allemaal zo officieel [Blog]

Mon, 01 Mar 2010 10:23:50 +0100

Online betalen

Sinds januari 2010 zijn we officieel Certified Ogone Solutions Provider, ofwel: we integreren nu online betalingen in websites, webshops en webapplicaties. Hoewel we voordien al webwinkels hadden ineengestoken, volgde Freek de officiële initiatie van Ogone - één van de grote spelers in België op gebied van online transacties - om de officiële titel te behalen.

In de praktijk: voor pichouline.com werd het uitchecken van een bestelling via overschrijving uitgebreid met online betalen via Visa of bankkaart. Voor de Lessius Hogeschool werken we momenteel aan een inschrijvingsformulier voor een seminarie, waarbij meteen online kan afgerekend worden.

Feweb

Nu we het toch serieus menen, zijn we sinds eind 2009 ook lid geworden van Feweb, de Belgische Federatie van Webontwikkelaars. Je kan Jef tegenkomen op de eerste @FeWeb -de algemene vergadering- van 2010, op dinsdag 02/03/2010 in Sint-Niklaas.

door willem

[spatie.be →]

Kathleen Van Brempt [Recent werk]

Tue, 16 Feb 2010 17:07:49 +0100

Voor Europarlementslid Kathleen Van Brempt bouwden we een nieuwe website die haar en de ploeg toelaat om de serieuze hoeveelheid aan beschikbare gegevens over haar activiteiten wereldkundig te maken.

De hoofdbrok van de site zijn de artikels in verschillende categorieën en thema's, die onderling gekoppeld worden door tags, en extern met foto's uit Flickr, of filmpjes op Youtube. Daarnaast kan er snel een enquête worden opgesteld onder de bezoekers.

De site werd volledig op maat gemaakt in ons Content Management System, van waaruit de klant alle artikels zelf beheert. Verder zorgden we voor een koppeling met een nieuwsbrief-module: van het inschrijven van abonnees, het samenstellen van de nieuwsbrief, tot de uiteindelijke verzending.

Lees hier meer over het ontwerpproces.

[spatie.be →]

FirePHP [Blog]

Mon, 01 Feb 2010 12:51:20 +0100

In elk project zijn er bugs die moeten opgelost worden. FirePHP is een van onze standaard tools waarmee we onze PHP code tijdens ontwikkeling en testfase kunnen debuggen. In deze blogpost zal ik kort toelichten wat FirePHP is en hoe je het kan gebruiken.

Wat is FirePHP?

FirePHP is een extensie op Firebug waarmee je vanuit je phpcode boodschappen kan schrijven in de Firebug console. Deze boodschappen kunnen een bepaald type hebben (bv. informatie, waarschuwing, foutmelding, ...).

Debuginformatie die je misschien nu met echo op het scherm brengt of mee in de gegeneerde HTML schrijft, kan je in netjes in een aparte console krijgen.

Firebug communiceert deze debuginformatie via de HTTP-headers.

Dat klinkt fijn, hoe kan ik FirePHP gebruiken?

Ten eerste zal je een extensie in Firefox moeten installeren. Omdat FirePHP een uitbreiding is op Firebug, zal je Firebug moeten installeren. Een webontwikkelaar zonder Firebug is als een DJ met enkel platen van Engelbert Humperdinck, dus mocht je Firebug nog niet kennen, wordt dan nu even schaamrood en installeer die hap. De Firebug-extensie kan je hier vinden, de FirePHP-extensie hier.

Vervolgens moet je een PHP klasse includen in je code. In de standaard download zit een wrapper-klasse waarmee je statische calls naar FB kan uitvoeren.
Je kan deze klasse hier downloaden.

Heb je misschien wat voorbeelden en screenshots van FirePHP?

Ja tuurlijk! Deze code:

FB::log("Hallo wereld")
FB::info("Hallo info boodschap")
FB::warn("Hallo waarschuwing")
FB::error("Hallo foutmelding")

geeft dit resultaat:

Je kan ook variabelen en arrays naar Firebug doorsturen:

$eendjes = array('eendje 1', 'eendje 2', 'eendje 3', 'eendje 4');
FB::log(count($eendjes) . ' kleine eendjes');
FB::log($eendjes);

zet dit op je scherm:

Als je met je muis boven de array gaat staan krijg je de inhoud van die array overzichtelijk te zien:

Firebug lust ook lekkere objecten

$mail = New Mail();
$mail->setTo('steve.balmer@microsoft.com');
$mail->setFrom('steve.jobs@apple.com');
$mail->setSubject('The tablet');
$mail->setMessage('I want it');
FB:log($mail);

Ook als je met je muis boven een object gaat staan, krijg je een mooi overzicht van de properties en hun waarden:

Meer voorbeelden kan je vinden in de handleiding van FirePHP.

Ziet er fantastisch uit, moet ik nog op iets letten?

Let erop dat als je site live gaat, dat je dan zeker alle calls naar FirePHP in commentaar zet of verwijdert. FirePHP communiceert via de HTTP Request ook namen van serverdirectories waarmee creatieve Russen en Chinezen je wel eens een hele slechte dag zouden kunnen bezorgen.

door freek

[spatie.be →]

Poor Man's Web to Print [Blog]

Sun, 24 Jan 2010 10:45:14 +0100

Voor het struktuurbureau UTIL uit Brussel beheren we een database gestuurde portfolio met hun klanten en bijhorende projecten in tekst en beeld. De opdracht was om naast de webinterface ook een traditionele downloadbare portfolio in PDF aan te bieden om proper af te kunnen printen.

De portfolio wordt slechts 2 keer per jaar aangepast: in dit geval dus overkill om een servercomponent te installeren die PDF's kan aanmaken vanuit de databank, en deze daarna te programmeren volgens de UTIL-huisstijl. Maar ook geen zin om dit telkens manueel aan te vullen in een PDF.

Ik ging daarom op zoek naar een werkbaar alternatief met tools die ik al heb, en die minimale manuele ingrepen vereisen. Volgende oplossing kwam uit de bus:

1. Trek de gegevens uit de databank

http:/www.util.be/portfolio

Via een php-script wordt de bestaande inhoud uit de databank opgelijst in de browser en met een speciale stylesheet opgemaakt. In deze stylesheet steken een aantal instructies die ik anders niet gemakkelijk zou gebruiken:

Een font -huisstijl font van UTIL- niet geschikt voor het web, maar dat ikzelf wel heb geinstalleerd. In mijn eigen browser ziet het er dus prima uit. Font-grootte in pt
Afmetingen in cm, voor de paginaopmaak straks
page-breaks na elk project

body{
	...
	font-family: DIN;
	font-size: 7pt;
	margin: 0 2.5cm;
	...
}

.pagebreak{
	page-break-before: always;
	height: 3cm;
}

Klein detail: even deze url in de robots.txt toevoegen zodat hij niet geïndexeerd wordt door zoekmachines.

Disallow: /portfolio

2. Print naar PDF vanuit Safari

In Safari wordt er nu naar PDF geprint via het standaard OS X print-menu. Resultaat is een gepagineerde PDF in de basic layout die ik in de stylesheet heb gedefinieerd.

De page-breaks uit de CSS worden mooi gerespecteerd, zodat elk project mooi op een nieuwe pagina komt. De eerste keer is het wel wat uitproberen om alles op de juiste plaats te krijgen.

3. Over naar Indesign CS4

Vervolgens switch ik naar Indesign waar ik een document heb klaargemaakt met een footer en paginanummers in een Masterpage.

Via het scripts-menu kan ik een multiple page PDF in één keer binnenhalen door PlaceMultipagePDF.applescript. Indesign maakt meteen het juiste aantal pagina's aan.

Kijk nu na of je pagina's de juiste Masterpage bevatten, voeg eventueel een intro en colofon toe om het document af te werken.

Tot slot exporteer je vanuit Indesign terug naar PDF (ik doe dit met custom settings met oa Embed Page Thumbnails en Optimize for fast Web View), en de PDF kan online.

Je kan uiteraard om het even welke software gebruiken om je geprinte PDF nog bij te werken, en hier pagina's, footers, etc... aan toe te voegen.

Bemerkingen bij deze werkwijze? Je kan het resultaat downloaden vanaf de UTIL info pagina.

door willem

[spatie.be →]

Paamayim Nekudatayim [Blog]

Mon, 18 Jan 2010 17:34:55 +0100

Bij het uitbouwen van een functionaliteit binnen ons CMS kreeg ik tijdens het testen plots deze PHP-foutmelding op mijn scherm: "Parse error: syntax error, unexpected T_PAAMAYIM_NEKUDOTAYIM". Tenzij uw roots in Israël liggen weet u waarschijnlijk, zoals mij enkele ogenblikken geleden, niet wat "Paamayim Nekudotayim" betekent.

Deze vreemde foutmelding duidt er op dat er ergens een dubbelepunt in de code staat waar die eigenlijk niet mag staan. Paamayin Nekudatayim is Hebreeuws voor "dubbelepunt". Deze foutmelding is waarschijnlijk het gevolg van het feit dat de makers van PHP van Israël afkomstig zijn en deze foutmelding (nog) niet vertaald hebben.

door freek

[spatie.be →]

I ain't gettin on no sleigh! [Blog]

Fri, 15 Jan 2010 16:26:30 +0100

Verrassend hoeveel fijne reactie er toch nog komt op een traditioneel gedrukt nieuwjaarskaartje. Dit jaar hebben we 2 versies laten maken met afbeeldingen die we op internet vonden (boodschap: "Alle dagen feest op internet!").

Versie 1 kwam ik toevallig tegen in de eindeloze stroom van digitale rariteiten. Je ziet Mr. T uit the A-team als kerstman met als cadeau een actiefiguur van zichzelf. De vrouw op zijn schoot is Nancy Reagan. Goed materiaal dus. Je vindt het origineel bijvoorbeeld op wikipedia.

Versie 2 komt van shorpy.com, een site met een hoop foto's uit de oude doos. Op zich weinig echte kerstsfeer, maar wie ons wat kent, zou toch enige gelijkenissen moeten zien. En ja, ik sta rechts.
Mocht je interesse hebben om (nog) een kaartje te ontvangen, laat zeker even een berichtje achter. Je zit dan meteen ook in het bestand voor volgend seizoen.

Eén van de voornemens voor het nieuwe jaar is wat meer updates te geven. Tien jaar na de hype dus alsnog een blog om naast het recente werk ook af en toe een tussenstand te kunnen noteren. Zit je op Facebook, kan je dezelfde blog en recent werk ook daar volgen, of gewoon via onze RSS-feed. Nog niet genoeg? Volg ons dan ook op Twitter.

door willem

[spatie.be →]

Sp•a tie [Blog]

Tue, 05 Jan 2010 08:58:55 +0100

Momenteel volop aan het werken aan de nieuwe website van Europarlementslid Kathleen Van Brempt, die wordt gebouwd in ons eigen CMS systeem - onder de werktitel Core CMS. Stap 1: iemands gezicht deftig krijgen in een favicon, het kleine icoontje om een site te bookmarken. 16x16 pixels om mee te knutselen, vreemd genoeg best leuk.

In de tussentijd publiceerden we alvast een tijdelijke pagina waar je op de hoogte kan gehouden worden van de lancering.
www.kathleenvanbrempt.be

door willem

[spatie.be →]

UniversiteitsForum [Recent werk]

Mon, 02 Nov 2009 12:58:26 +0100

Ontwerp van het nieuwe logo voor het UniversiteitsForum van de Universiteit Gent. Het logo werd ingehuldigd tijdens de plechtige opening van het gebouw in oktober 2009.

Bekijk hier het volledige project.

[spatie.be →]

Talboom Milieu [Recent werk]

Fri, 30 Oct 2009 05:00:00 +0100

Ontwerp en drukwerk van een bedrijfsbrochure voor de Talboom groep, aansluitend bij de eerder voor hen ontworpen huisstijl.

[spatie.be →]

The Clinical College [Recent werk]

Fri, 17 Jul 2009 15:34:28 +0200

Website voor The Clinical College voor het online boeken van opleidingen in de medische sector. De site wordt volledig door de klant zelf beheerd in een webinterface (Content Management System) die op maat werd geconfigureerd.

De betalingen van de cursussen zullen binnenkort online kunnen gebeuren via een koppeling met Ogone.

[spatie.be →]

Mutsy 2009 [Recent werk]

Fri, 05 Jun 2009 15:24:20 +0200

De Europese site van Mutsy werd uitgebreid met animaties voor de collectie van 2009, aansluitend bij de lancering van de nieuwe brochure.

De foto's van Stany Dederen werden opgeknipt, geanimeerd in Flash en voorzien van de nodige audio.

Bekijk alle product-intro's op mutsy.nl.
(sectie 'Strollers' & sectie 'Seating > Easygrow')

[spatie.be →]

Vacature developer [Recent werk]

Mon, 11 May 2009 12:15:37 +0200

Er is nog ruimte. Wij zijn op zoek naar een freelance webdeveloper, om te assisteren bij de ontwikkeling van Web-to-Print applicaties, Digital Asset Management en CMS systemen.

Je werkt samen met ons aan webapplicaties die onder andere online catalogi, personalisatie & proofing van drukwerk, shopping baskets & exports omvatten. Kennis van VB.net, XML, HTML/CSS en Javascript is vanzelfsprekend, notie van de drukkerswereld is meegenomen, en PHP/MYSQL is goed om weten bij andere lopende projecten.

We zoeken iemand die initieel 2 tot 3 dagen per week — op termijn uitbreidbaar — beschikbaar is, uiteraard om een langdurige samenwerking op te bouwen. Je werkt in opstartfase op ons kantoor in het centrum van Antwerpen in team, maar thuis werken is zeker een mogelijkheid.

Veel te bespreken dus. We verwachten je CV en vragen alvast op info@spatie.be.

[spatie.be →]

Pichouline.com [Recent werk]

Wed, 01 Apr 2009 21:45:56 +0200

Eind maart lanceerden we Pichouline.com, een webwinkel die draait rond kinderfeestjes en alle artikelen die hierbij horen. Je bestelt items online, waarna alles wordt afgehandeld via e-mail.

De site wordt volledig beheerd door Veronique zelf, die haar producten, foto's en bestellingen kan beheren in een op maat gemaakte back-office.

Binnenkort verschijnt een franse vertaling.

[spatie.be →]

DMP Carlsberg skin [Recent werk]

Wed, 25 Mar 2009 22:41:08 +0100

Als ondersteuning bij een technology demo van hun W2P pakket, vroeg DMP ons een skin te ontwikkelen voor Carlsberg.

Op basis van bestaand materiaal van het merk werd een voorstel uitgewerkt met een continue maar niet te nerveuze banner bovenaan, en de juiste kleuren voor de W2P omgeving.

We werkten de afgelopen maanden ook mee aan de Web-to-print en Workflow software van DMP, die we volgens hun specificaties uitontwikkelden. Daarnaast traden we op als integratoren voor hun Flo-suite pakket bij oa. drukkerij Artoos en Vegas reclame.

[spatie.be →]

Mutsy update [Recent werk]

Fri, 20 Mar 2009 21:21:04 +0100

Voor Mutsy, een fabrikant van kinderwagens, bouwden we 3 jaar geleden een Europese en Amerikaanse site die ondertussen aan zijn 3de lente-update toe was.

Naast het aanvullen en opfrissen van de collectie, met aangepaste product-animaties en tekst, werd een Poolse versie toegevoegd en een uitgebreide media sectie.

[spatie.be →]

Util huisstijl [Recent werk]

Tue, 03 Feb 2009 00:21:29 +0100

Huisstijl voor het studiebureau Util uit Brussel. Redesign van hun bestaande logo naar een strakkere en leesbare variant, zonder het basisidee, het gebruik van verschillende staalprofielen, te verliezen.

Aansluitend werden verschillende toepassingen voor stationary en online onderzocht en ontworpen.

Het drukwerk is in de maak, de website volgt later dit jaar.

[spatie.be →]