zijn het béste leerbedrijf van Nederland, bestaan uit ruim 80 enthousiaste professionals, doen al ruim 18 jaar gave internet projecten voor grote klanten zoals NXP, KPN, Philips & FC Twente, werken in een inspirerende werkomgeving, bieden studenten de kans zich verder te ontwikkelen, zoeken een student met pit voor onze team Application Maintenance!

Jij?

bent (minimaal) HBO-er, hebt een passie voor OO ontwikkeling, voelt je thuis in PHP/MySql of Java/Oracle, bent ambitieus & gemotiveerd, zoekt een uitdagende bijbaan in een leuk team!

Match?

Mailen: Eric.Kramer@TriMM.nl

Bellen: 06-22690020

Kijken: pittenbijtrimm.nl

zijn het béste leerbedrijf van Nederland, bestaan uit ruim 80 enthousiaste professionals, doen al ruim 18 jaar gave internet projecten voor grote klanten zoals NXP, KPN, Philips & FC Twente, werken in een inspirerende werkomgeving, bieden studenten de kans zich verder te ontwikkelen, zoeken versterking voor ons team Systeembeheer!

Jij?

bent (minimaal) HBO-er, hebt een passie voor ICT, voelt je thuis in UNIX & LINUX, bent ambitieus & gemotiveerd, beheerst Nederlands & Engels, zoekt een leerzame en flexibele bijbaan!

Match?

Mailen: Eric.Kramer@TriMM.nl

Bellen: 06-22690020

Kijken: pittenbijtrimm.nl

zijn het béste leerbedrijf van Nederland, bestaan uit ruim 80 enthousiaste professionals, doen al 18 jaar gave internet projecten voor grote klanten zoals NXP, KPN, Philips, Politieacademie & FC Twente, werken in een inspirerende werkomgeving in ons nieuwe pand, bieden studenten de kans zich verder te ontwikkelen, zoeken een student met pit voor een leuke afstudeeropdracht!

Jij?

bent (minimaal) HBO-er, hebt een passie voor OO ontwikkeling, voelt je thuis in PHP/MySql of Java/Oracle of XSLT, bent ambitieus & gemotiveerd, zoekt een uitdagende afstudeerplek!

Match?

Mailen: Eric.Kramer@TriMM.nl

Bellen: 06-22690020

Kijken: trimm.nl

Toen ik eenmaal bij Pit binnen was kreeg ik al heel snel mijn eigen plek. We zaten nog in het oude pand (of liever gezegd de oude panden), en zaten op een gezellig ingerichte werkkamer. Ik maakte kennis met mijn collega’s, kreeg een eigen mailbox en kreeg een rooster voor de komende 2 weken. Het rooster was een heel rustig rooster waarin ik iedere dag langs een andere afdeling liep. Daar aangekomen leerde ik de mensen achter de techniek kennen, en vertelden ze me wat ze allemaal deden, en hoe ze het deden. Ik zelf vond dit een heel leuk proces, omdat je niet in een keer word overladen met mensen, namen en bezigheden, maar je rustig van dag tot dag alle afdeling leert kennen.
Toen ik het bedrijf eenmaal kende en ik opdrachten kreeg merkte ik al snel dat dit de plek was die ik wilde. Ik heb (vooral na mijn stage) heel veel van dit soort verhalen gehoord:

Internship

En als er iets was wat ik niet wilde, dan was het wel een stage waarbij ik niks zou leren. Gelukkig zat ik op de goede plek, en kreeg dan ook al snel te horen dat ik een Flash cursus van Paul zou krijgen, en een Wordpress cursus van Tom. Ik kreeg juist deze cursussen omdat ik van tevoren had aangegeven dit graag te willen leren. Daarnaast werd ik al snel gewezen op mijn HTML pagina’s met zo’n 100 error’s en leerde ik met databases omgaan.

De 6 maanden van mijn stage vlogen voorbij, en na een hele leuke projecten voor Philips en de TriMM site wilde ik dan ook niet meer weg. Gelukkig kreeg ik aan het eind van mijn stage de kans om nog een jaartje langer te komen pitten. Ik greep deze kans natuurlijk met beide handen aan, en ondertussen ben ik al een jaar bij Pit. Ik heb het tot op de dag van vandaag nog steeds enorm naar mijn zin bij Pit, en werk nog steeds aan hele leuke projecten. Ik zou dus iedere enthousiaste en leergierige Hbo’er of Hbo’er aan willen raden om bij Pit stage te gaan lopen. Je krijgt super leuke collega’s, echt werk dat jij graag doet en heel veel ruimte.

Groetjes,
Marc

Het begin was natuurlijk om een leuk concept te bedenken. Dit bleek echter nog een stuk moeilijker te zijn dan ik had verwacht. Er was simpelweg zoveel moois. Wat moest ik nu kiezen? Ik begon wat te photoshoppen, maar al snel bleek dat ik het liever tekende in Flash. Ik maakte een week lang allerlei designs, maar was over geen van allen echt tevreden. Ze waren wel mooi, maar niet mijn stijl.

Wat is dan wel mijn stijl? Ik had echt geen idee. Tot ik op een dag een paar glossy robot achtige vector buttons en stickers tegen kwam. Ondanks dat ik het hele web drie keer heb na gezocht kan ik ze helaas niet meer terug vinden, maar ze leken in ieder geval erg veel op dit:

Design

Deze stijl vond ik direct helemaal geweldig, en na wat geprobeerd te hebben in Flash bleek dat het ook nog eens een perfecte stijl is om in flash te tekenen. De grap is namelijk dat er niet teveel poespas aan zit, allemaal lekker strak is en hele subtiele verloopjes heeft. Daarnaast zijn de kleuren cruciaal voor het effect.

Toen de stijl en het onderwerp duidelijk waren miste ik nog de uitwerking. Na een paar dagen The FWA afstruinen kwam ik op deze site: http://www.zeebee.co.uk/ Buiten het feit dat deze site er super strak uit ziet, werkt hij heel fijn en is hij super duidelijk. Je hebt nooit het idee dat je verdwaald bent in de site, of dat content mist. Toen ik eenmaal had bedacht hoe ik het effect na kon bootsen, besloot ik het eindresultaat te maken in Flash CS3 met als basiscode AS2 (ik wist nog niks van AS3, vandaar dat ik besloot het te maken in AS2).

Ik begon met het maken van de cirkel. Het lastige daarvan was het 3D effect. In CS3 zit nog helemaal geen 3D engine, en met applicaties van derden zoals papervision had ik ook geen ervaring. Ik gooide het dan ook op de hackersmanier, en hackte mezelf een weg door AS2. Inmiddels was ook mijn stage bij TriMM begonnen, en ze vertelden me dat een paar weken later mijn Flash cursus zou beginnen. Dit vond ik natuurlijk helemaal geweldig, want ik had nog wel een zeecontainer vol vragen.

The Circle - AS2

Na 2 weken designen en programmeren was dit het resultaat.

Het zag er uit zoals ik wilde, maar was enorm zwaar, vertoonde allerlei onverklaarbare bugs en was nog lang niet af. Ik moest dus beginnen met de bugs op te lossen, maar omdat deze applicatie was gebouwd met het spaghettimodel viel dit nog niet mee. Na een week prutsen gaf ik het op. Ik had een halve applicatie gemaakt die vol zat met bugs, en dus waardeloos was. Dit kwam voornamelijk omdat je een een ingewikkeld model bouwt wat je steeds meer uitbreidt aan alle kanten, maar waar geen vaste structuur in zit. Het probleem was dat als een gebruiker links op een knop drukte en daarmee een event afvuurde, er rechts nog wel 3 events afgevuurd konden worden die allemaal weer hun eigen functies aanroepen. Hierdoor verlies je op den duur overzicht, en krijg je onverklaarbare bugs.

Op dat moment begon ook mijn Flash Cursus van Paul. In de eerste les werd al duidelijk dat het een AS3 only cursus zou worden. Omdat ik alleen nog maar met AS2 had gewerkt, was dit voor mij een lastige omschakeling. Ik zag er enorm tegenop omdat ik bang was dat al mijn kennis nutteloos bleek te zijn in AS3. Maar na 1 week bleek al snel dat dat niet het geval was, en dat AS3 wel degelijk een enorme verbetering is.

Bij de cursus gingen we al gauw in op applicatiemodellen en hoe je een structuur van een applicatie om zou moeten zetten. Hierover had ik nooit echt goed nagedacht, en het was voor mij dus ook helemaal nieuw. Ik was altijd gewend veel te praten over de code, en hoe je met minder code het zelfde kunt doen. Een dergelijke applicatie structuur had ik zelf al min of meer ontwikkeld, maar dit was een stap hoger, en ging in op hoe je je applicatie op zou moeten zetten.

Zo is er bijvoorbeeld naast het spaghettimodel ook nog het MVC model. Dit is de meest gebruikte methode, en is (mits goed toegepast) heel eenvoudig uit te breiden, aan te passen of kleiner te maken. Bij een MVC model (Model, View, Controller) is het de bedoeling dat je een Model maakt (Dit is min of meer de database binnen je applicatie), een View met eventuele extra view classes (Dit is alles wat je op het scherm ziet), en een Controller (Dit is het brein van je applicatie).

MVC Model

In dit plaatje word ongeveer duidelijk hoe het werkt. Het idee is om te beginnen met 1 controller. Voor grotere applicaties worden meestal meerdere controllers gebruikt zoals een opstart controller en een runtime controller. Deze controller maakt vervolgens een lege model, en zegt tegen de model “ga je data halen”. Het model haalt z’n data, geeft een seintje terug als “ok ik heb de data ingeladen en verwerkt” en vervolgens gaat de controller daar mee aan de slag. Hij maakt een viewmanager en geeft hem opdrachten. Een opdracht zou bijvoorbeeld kunnen zijn teken een voetbal. De viewmanager maakt dan een nieuwe viewclass die een bal laat zien, en zet deze op je scherm. Als vervolgens een bezoeker op de bal klikt gaat dat signaal omhoog, en bereikt de controller. De controller kan dan op zijn beurt bepalen wat er op dat moment in de applicatie gaat gebeuren. Hij kan bijvoorbeeld aan de model vragen “op welke plek zijn we nu binnen de applicatie?”. De model zegt dan “we nemen nu penalty’s” waarop de controller weer tegen de viewmanager zegt “ok, schop tegen die bal aan”.

Het voordeel hiervan is dat je een heel gestructureerd model hebt waardoor uitbreiden/beheren veel eenvoudiger wordt. Ik besloot helemaal opnieuw te beginnen, en mijn website opnieuw te bouwen in AS3, volgens de methoden die ik had geleerd bij mijn cursus van Paul.

Ik begon met te inventariseren van wat de applicatie moest kunnen. Wat een logische volgorde zou zijn om dit te realiseren en hoe ik dit uiteindelijk ging vertalen naar code. Dit zag er ongeveer zo uit:

Functionaliteit:

• Projecten sorteren op jaar en op type
• Jpg’s, png’s, gif’s en FLV’s kunnen laten zien
• Projecten kunnen meerdere jpg’s/png’s/gif’s/FLV’s als inhoud hebben
• Mijn tweets integreren
• E-mail functionaliteit
• Rechtermuisknop en mouseWheel functionaliteit
• Volledig toetsenbord functionaliteit (de site moet te besturen zijn zonder muis)
• Fullscreen en geluid functionaliteit (voor een betere beleving)

Volgorde:

• Preload
• Applicatie start
• Model haalt en verwerkt data
• viewmanager start met intro
• viewmanager maakt menu
• viewmanager haal Twitter posts
• Intro eindigt Startup controller geeft controle over aan main controller

Code:

• Data zal worden aangeleverd als XML
• Data word omgezet naar array van objecten met een toegevoegd ID
• Meerdere foto’s/filmpje’s worden in dataObject gezet als workArray
• Cirkel draait op X, Y, Z as en verplaatst zich op de Z as.
• Alle grote events gaan naar de controller (events als item click, cirkel swap, menu click)
• Kleine events worden (mits mogelijk) afgevangen door de viewmanager (events als “jpg vergroot click”)

Toen ik eenmaal een paar weken aan het programmeren was merkte ik al gouw dat mijn beperkte AS3 kennis het me erg moeilijk maakte. Daarnaast maakte ik een aantal essentieële modelfouten. Zo had ik bijvoorbeeld:

een functie om een item te openen. Deze functie werd aangeroepen door een mouseEvent (click). Maar nu wilde ik dat dezelfde functie ook te openen zou zijn door middel van een enter. In plaats van een keyPress functie te maken wijzigde ik de eerste functie in:
Private function openItem(pEvent:MouseEvent = null, pItemId:uint = null):void{
if(pItemId == null){    //je bent hier gekomen via een mouseclick

}else{//je bent hier gekomen via enter

Dit is de hack manier, en het beste is dan ook dit soort manieren te vermijden. een betere optie zou zijn:

- een event listener voor een keyboard toets – doe de keyboard functie
- een event listener voor een open_item event – doe de open_item_click functie

-functie keyboard: check welke toets het is, als het de enter is doe dan de open_item_enter functie
-functie open_item_enter: haal het ID, daarmee de data en doe je ding
-functie open_item_click: haal het ID, daarmee de data en doe je ding

Na een hoop sparren met Paul werd het mij langzaam steeds duidelijker; als je verder wilt met programmeren dan moet je dit kunnen.

Na zo’n 7/8 weken was dit het resultaat: link

The Circle

Toen ik dit eenmaal bereikt had, was het moeilijkste gedeelte achter de rug. Ik moest toen alleen nog besluiten hoe ik mijn data ging beheren. Hiervoor zijn tal van opties, waarvan ik al heel veel slechte heb geprobeerd. Van data opslaan in .txt bestanden op je server tot een XML RPC voor wordpress. Geen van deze opties waren geschikt voor mijn doeleinden, en het bleek toch al snel dat ik een MySQL database nodig was. Dit had ik bij TriMM al geleerd, en bleek een stuk eenvoudiger te zijn dan dat ik aanvankelijk dacht. Maar nog steeds was er dat gat tussen beheren/database/flash.

Omdat ik wel een beetje PHP/HTML/CSS kennis had besloot ik de site te gaan beheren door middel van mijn eigen custom made CMS in PHP. hiermee kon ik de database vullen/wijzigen/verwijderen. Deze CMS is hier te vinden: link Deze CMS had ik na 1 week af, en hiermee was het gat tussen beheren en database gedicht.

Toen bleef er nog het gat over van database naar Flash. Omdat Flash niet zomaar een database kan benaderen zal daar altijd een tussenstap moeten zijn. Dit kan in enorm veel talen en op enorm veel manieren. Ik zou bijvoorbeeld een xml dump kunnen doen vanaf de database die Flash vervolgens weer uitleest. Nadeel is alleen dat die XML dump niet altijd up-to-date is, en bovendien heb ik geen zin om bij iedere update die xml dump te maken. Dit is natuurlijk wel te automatiseren, maar het klonk me toch een beetje dubbel. Ik besloot het anders te doen, en een php pagina te maken die alles uit de database haalt, en dit weergeeft als XML formaat. Deze pagina is hier te vinden: link

Toen dit eenmaal ook werkte was de applicatie af, en kon ik trots terug kijken naar wat ik had gebouwd. Ik heb de site sindsdien nog een aantal keer ge-update met functies als: javascript call naar lightbox als je een foto wilt vergroten, een settings change box in het begin en een RSS Feed.

The Circle - Intro scherm

The Circle - Lightbox

The Circle - RSS feed

The Circle - Iphone

Ik ben enorm blij dat TriMM mij deze cursus heeft willen geven, en met alle kennis die heb opgedaan tijdens deze cursus. Toen ik bij TriMM kwam zat ik min of meer een beetje vast met programmeren, en dacht ik dat er niet zo veel meer meer was. Maar bij TriMM heb ik gezien dat er nog een gigantische wereld voor me open ligt wat programmeren betreft. Ik ben TriMM/Paul de Jong en Hans Wichman (die mij ook enorm heeft geholpen) enorm dankbaar hiervoor, en ik hoop dat ik doormiddel van dit verhaal deze kennis weer een beetje kan doorgeven aan nieuwe programmeurs.

Greetz,
Marc

Werken bij TriMM is een ware oase. De sfeer en de bevolking hier is erg relaxed, om over de sociale voorzieningen nog niet te spreken. Een kop cola, chocola of toch een appeltje voor de dorst? Je roept het maar en het is hier. Mja, je moet het nog wel zelf ophalen.. maar een beetje beweging is ook niet weg, toch?

Ruim 3 maanden geleden solliciteerde ik bij TriMM en na 2 gesprekken ben ik aangenomen als webmaster. Eerst was het nog een beetje uitzoeken of ik het wel zou redden qua beschikbaarheid, want ik ga hiernaast nog gewoon fulltime naar school. Toch hebben we genoeg gaten weten te vinden en is mijn werkzaamheid bij TriMM een feit.

Ik werk eigenlijk alleen ’s avonds, twee avonden in de week. Dan werk ik vooral voor NXP Semiconductors, een afstammeling van Philips die chips produceert. Nee, geen Paprika of Thai Sweet Chili, maar elektronische chips, zoals die in je TV. Zit ik hier in dit huge pand een beetje eenzaam te zijn en aan opdrachten te werken. Die opdrachten komen van NXP medewerkers, die op de een of andere manier iets met de website van doen hebben. De opdrachten die ik doe zijn vaak niet groot, het zijn kleine onderhoudsdingetjes (linkje hier toevoegen, PDFje daar updaten). Vaak komt het voor dat zo’n opdracht door iemand anders moet worden opgelost, iemand die er gespecialiseerd in is. Zo ben ik bijvoorbeeld geen (doorgewinterde) programmeur, dus programmeertechnische taken stuur ik door. Als webmaster ben ik vaak het doorgeefluik/de coördinator van berichten van de klant naar de gespecialiseerde mensen binnen TriMM.

Ik vind het ook even goed om in te gaan op de titel “PiTter”. Dat werkt zo: ik werk stiekem niet voor TriMM, maar voor TriMM PiT. Net zoals alle andere “werkstudenten” hier.
PiT staat voor Professional in Training. En die titel wordt hier binnen TriMM echt gestimuleerd. Elke week mag ik gemiddeld een uur tijd van TriMM gebruiken om een willekeurig gebied te ontdekken dat met het ontwikkelen van websites te maken heeft. Van design tot hardcore programmeren, als ik het wil leren dan krijg ik daar de ruimte voor. Natuurlijk moet ik het dan wel op een of andere manier binnen TriMM kunnen gebruiken, als de tijd daar rijp voor is. Zo ga ik de komende tijd meer dingen leren over WordPress, een CMS dat steeds vaker wordt gebruikt voor het maken van websites. Vet interessant natuurlijk, want ik kan het, naast mijn werkzaamheden binnen TriMM, ook zeer goed gebruiken voor mijn ontwikkeling als webdeveloper. Cool is ook dat er binnen TriMM veel mensen rondlopen die van bepaalde zaken heel veel verstand hebben, daar kun je je dan aan optrekken. Bijvoorbeeld binnenkort, dan wordt er voor de mensen die geïnteresseerd zijn een workshop gegeven over hoe je WP kunt gebruiken als CMS (met inbouwen van template en dergelijke). Mooi meegenomen

Zit ik hier een beetje reclame te maken, terwijl ik er niet eens opdracht toe heb gekregen…… Je snapt wel dat ik best enthousiast ben over TriMM!

Maar goed, dat terzijde. Dit stukje gaat eigenlijk over de vernieuwde PiT site. Er zitten een aantal nieuwe snufjes in, zoals: een blog (waar je nu het eerst item van leest), een overzicht van onze mensen en de openstaande vacatures. Het idee is dat de bezoeker (jij) inzicht krijgt in het leven van een PiT’er. Hieronder kun je laten weten of dat gelukt is!

P.S. Ik hoop dat ik met dit verhaal niet teveel emmers over heb laten lopen…