Computer programming is tremendous fun. Like music, it is a skill that derives from an unknown blend of innate talent and constant practice. Like drawing, it can be shaped to a variety of ends – commercial, artistic, and pure entertainment. Programmers have a well-deserved reputation for working long hours, but are rarely credited with being driven by creative fevers. Programmers talk about software development on weekends, vacations, and over meals not because they lack imagination, but because their imagination reveals worlds that others cannot see.

from: Larry O’Brien and Bruce Eckel in Thinking in C#

Introduction

As the leading quote, this objective shall for me use principles that naturally further clean code and to split tasks for easy and fast cooperation and maintenance. To code is not that special nowadays as it was before, but to have a high standard and make your software understandable for others is a progressive trend through social coding and sites like github.com, jsfiddle.net or cloud9.com.
Creativity is important for every programmer. To lead this creativity into the right channels, without hindering the workflow, there are architectural guidelines like MVC. It’s short for Model-View-Controller, which I will explain at a later time.
The user is by now used to, that pages are updated on the fly. New messages on facebook or google+ are shown immediately with red tags on the symbol, corresponding to the type of event. On twitter the timeline shows when and how many new tweets have been published since you’ve loaded the page. These features are realized through AJAX (Asynchronous JavaScript and XML). In plain English it means that some of the content of a website is exchanged through JavaScript. This makes the communication between server and client asynchronous and often aids better user interaction.

Model View Controller

Good programmers use their brains, but good guidelines save us having to think out every case.

-Francis Glassborow

The MVC architecture divides a program in three different units, that interact with each other in a specific way. These conventions are in the beginning sometimes seen as a little annoying, but I personally swiftly got used to them and appreciate this way of development. One of the most popular MVC frameworks, Ruby on Rails, runs on twitter.com.

Model

The Model is the part of the program dealing with data storage, reading and writing data to a database. This can be both table based or document based like Google’s BigTable or the CouchDB.

View

A View generates visible output for the user. It’s used to display information and also elements for interaction with the rest of the program.

Controller

As the name already states, the Controller controls the program. A Controller tells the Model which data to get or to write and the Views which to display.

AJAX

Asynchronous JavaScript and XML has majorly influenced the way complex online interfaces are built to aid the user in interacting, achieving goals faster and decreasing loading processes.
Retrieving data when needed, instead of re-generating and re-transferring results with every click, saves both bandwidth and time. Since the development time of a software project usually is significantly smaller than the hours spent using it, it makes perfect sense investing time for development to save time and money on use.
AJAX prevents us from hammering the refresh button, when we’re waiting for an email to arrive and using a webmail interface or show us which users are visiting the websites we are maintaining in realtime (smartly used in piwik).

Used frameworks

The only people who have anything to fear from free software are those whose products are worth even less.

-David Emery

jQuery

It’s the biggest state of the art JavaScript framework today, that is why it is often required by firms and through hundreds of tutorials and a great documentation, very easy to learn.

CodeIgniter

As jQuery, CodeIgniter is quite famous. The framework is developed by EllisLab, but everybody can contribute, fix bugs or add features through github. As it simplifies a lot of everyday tasks for developers and provides a strong and clean structure through the MVC architecture it has built a solid reputation through the past years.

Famous Use Cases

For me, the two most incredible use-cases of AJAX are the operations you either can’t or don’t want to do on the client side, therefore the data is either processed on the server side or just gotten from a database, with checking for authentication and so on.
You could say: AJAX is only for those, who have too much traffic, they only save bandwidth with it. I beg to differ. It can also significantly increase the usability on your website. Waiting is boring and will scare your users away, so you try to give them updates and notifications as quickly and as uncomplicated as possible. The way to do that is AJAX.

Twitter

Twitter has quite elegant use of AJAX all over their page. The most obvious may be the new tweets button. When a new tweet appears in a timeline or in search of a tag, there is a little button on top of the page, that indicates when new tweets have been published.

Why not just put them in there? Because users might not like it. Scrolling output is for running processes on Linux machines, that only geeks handle for monitoring.

What else is handled through AJAX, is user profiles. When you scroll through a list, your own timeline or a tag and click somebodies username, the profile is loaded in the right sidebar. Now, let’s say we have a list of ~100 people and 20 of them have tweeted recently, no profiles are loaded at first. When you click a username, the profile page of the according user appears, showing the recent 3 tweets. By using AJAX you save database (or cache) queries for 60 tweets, statistics for followers, following, amount of tweets and listings for 20. This already sounds like a good deal, right?

Facebook

You may have noticed, that the small red squares show up when you have new messages, notifications or invitations to events on facebook. I’ll not go deeper into this, because this is very similar to twitters, just that the updates are put in a small drop-down box, instead of being pushed into the main content area.

What I think is more interesting is, that when you reach the bottom of a timeline, new content is loaded automatically.

By chopping the informations displayed into smaller chunks and loading them along the way your benefits by using it are:
- less processing time on the server
- less bandwidth consumption
- less rendering time, because less information has to be processed by your browser

MVC

The Model View Controller architecture is used in the aspiring Ruby On Rails framework, which is used by for example Google, Twitter, amazon.com, Yahoo! and BBC. One of the most common PHP frameworks in that category is CodeIgniter which is used to power modelportalen.dk.
If we look at the projects, their services are not the most simple to provide. The characteristics they share are heavy workload, the user expect them to have a high uptime and without errors at any given time. Also neither the maintenance nor the development of the above mentioned is a one-man show.

How does MVC contribute to a collaborative development process?

MVC does more than splitting the jobs into three parts. Current version control systems do more than just to check if a file has been changed. It automatically merges the newest lines together, and only if one line has the same line changed in two different ways, manual work has actually to be done.
With an MVC architecture you would naturally divide your workload into two teams. The web designers / frontend developers would work on the Views, where the developers would stick to the controllers and models. Of course, many others are possible and complex projects require more planning, but it’s already easier and faster, than to hardcode output or write an extensive backend system for placing elements.
Wordpress, in contrast, is a fully featured CMS, so the comparison might sound a little misplaced, but adding functionality to a website that is powered by WordPress usually happens through plugins and modifying the functions.php file within the theme folder. This offers a lot less flexibility to development team, than the above mentioned division.

AJAX login example

To start without combining the MVC and AJAX right away, this is a simple login form test in AJAX.

index.html

		AJAX login form

<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script><script type="text/javascript" src="js/ajaxlogin.js"></script>
</pre>
<form id="login_form" method="post">
User: <input id="username" type="text" />

Password: <input id="password" type="password" />

<input type="submit" value="Login" /></form>
<pre>

The only AJAX specific thing here, is the empty div at the bottom of the page and of course the included script files. The status div will be used to insert the information that the script gives back upon a users login attempt.
ajaxlogin.js

 jQuery(document).ready(function(){
	$('#login_form').submit(function(){
		var unameval = $('#username').val();
		var pwval = $('#password').val();
		$.post('backend.php', { username: unameval, password: pwval },
		function(data){
			$('#status p').html(data);
		});
		return false;
	});
});

This is a straight forward post request, which returns the targeted scripts output and inserts it into the paragraph in the div with the id status. The return false prevents the submit button from actually doing something, because the JavaScript handles it already.

backend.php

<?php
$username = $_POST['username'];
$password = $_POST['password'];

if ($username == 'Zuka' && $password == 'sukinsins'){
	print'Like a boss';
}
else {
	print'Y U FAIL AT LOGIN?';
}

Here we see a contrast to an MVC attempt, as this just is a dummy php file doing the checking, it’s okay to user print and echo, which you would not do in an MVC application, you would load a View.

How does AJAX change the work of a programmer?

Controlling complexity is the essence of computer programming.

-Brian Kernigan

AJAX changes the way of writing a web project and takes it to a little higher level. First of all, you have to make a decision if your project should be usable without JavaScript enabled (web crawlers usually don’t interpret JavaScript). That means that information should be available through alternative hard links, when JavaScript is not used.
Second, you have to keep elements on the same page very modular and easily accessible in the DOM. That sometimes means more encapsulating elements and also writing scripts that only output specific parts of the page, the ones that either are loaded later on or refreshed in page during a visit.
Third, you will write a whole lot JavaScript more than usual and have to take into account that you may need to re-write some parts of the JavaScript upon style changes, to keep the project consistent.
Furthermore you may have to make some changes and process some of the JavaScript through PHP to use variables, constants or other server-side scripting features in your client-side code.
An important thing to remember is to decide if content should be exchanged or refreshed seamlessly or if it should be clarified that something has changed on the site. Loading graphics can be essential to show the uneducated user, that something actually is happening. This can prevent confusion because the communication with the server is visualized. Also error messages upon fail are essential for AJAX powered pages:

How does MVC change the work of a programmer?

This is more up to the programmer how he/she adapts it. Also how extensively the division into the three parts is undertaken. Basically you CAN make some calculations on output in the View, but you shouldn’t. Also you should not make a Controller output Data directly, around a View, but make it a variable in a View. Data should be ready for display when they leave the Controller.
The really big advantage of working with MVC is the teamwork. The requirements to the individual parts can be very specific, so misunderstandings can be minimized.
When pulling off a project with, for example, a designer and a developer, the designer can send his requirements for the pages in a list and the developer makes sure these data sets are included when the View is loaded, so it can be ordered and styled in the output. This way the two can work both on what they’re best at.

Conclusion

Both using a solid architecture and enhancing user experience through faster interaction is something you have to take care of, to create competitive web projects.
In the paper above I’ve pointed out what is so helpful about the technologies mentioned and why I use them.

Sources

• common sense (whatever that might refer to in our times)
• http://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93controller
• http://codeigniter.com
• http://jquery.com
• http://en.wikipedia.org/wiki/AJAX
• http://twitter.com
• http://facebook.com

Here is a list of things I’d like to do during these weeks:

1. (WordPress) code my first Plugin
2. (WordPress) code an awesome theme, public domain
3. (Drupal) write a module or fix bugs in some
4. (CodeIgniter/Active Records) create pastebin-like service (for translations)
5. (Diaspora) make improvements to the user interface
6. (social media) set goals and reach them with 2-3 facebook pages and 2-3 twitter accounts
7. (nothing) Not doing any of this, handing in a finished project and working on my firm instead
8. (video) make some motion graphics (maybe mixed with some real footage)
9. (music) finish writing my first album, teaming up with people for vocals and music and produce it
10. (photography) make some awesome online presentation web-code

• a little long term photo project, nothing fancy, but still a personal project, I’d like to do
• updating my portfolio, changing informational hierarchy, summing things up for people without much time on their hands, presenting my most interesting cases
• running more twitter accounts, I’ll probably be partly in charge of 1-2 more (social media geekery)
• write tutorial about my Adobe After Effects + Adobe Premiere Workflow like I used it in my last video
• shoot worlds larget catwalk as a photographer
• portrait shooting coming up
• compile and submit some playlists (music is a social thing, you know?)

To lift this post a little to a visual level, here’s a screenshot of my MacOS desktop right now. Picture was shot on the way to Latvia and the nice time and date display is made with geek tool

The other video shoots were not going that smoothly, but delivered good footage in the end and they also were a lot of fun.
The most advanced light setup had Kenneth, with a silhouette flashing lamp, a dark room that first gets lit up when the second actor enters the room. For the lamps used a bunch of thanks to Ragno/Mette from MeRox Studio.

To sum up the shoots I was involved in:
- jumped into one that lasted half the night with very experimental lightning and from these hours only a time-lapse of by passing cars was used.
- played the evil nature polluting guy, wearing my top hat + voice over in Adinas video
- handled lightning and camera angles at Kenneths primary shoot
- played the shizophrenic guy in Tronds video
- played a freezing guy and a guy that gets stroked and scratched in Tanitas video

Thanks to my girlfriend without whom this project would not have risen at all, also thanks to everybody who supported me, gave me input and tought me about the used software, without this had never been possible.

Finally yesterday the NoMA film festival was hosted and I want to thank everybody who made it possible, helped out, made print-material and helped others to finish their videos. It was a blast.

So after all the talking, here my video is:

Shooting Interviews

shooting two people -> equal headroom, equal lookspace

choose interesting background, out of focus

Talking to camera-> direct, reporter
Talking slightly off camera -> indirect

Make the interviewed feel comfortable, ask easy questions until they are.

If questions are extracted from footage, ask them to incorporate the question.

Editing:

3 way colour correction:

- make sure fleshtones look natural unless desired otherwise by context

audio gain:
- control volume

adjust speed
- slow motion (intensify moments)

Tips on storyboarding:

note camera movement and sketch objects/characters
think about POV, perspective, blur

Vocabulary of today:

• POV = point of view
• DOF = depth of field

1. design consistency
2. semantics
3. readability

Design Consistency:

In the menu on the left, there are rounded boxes and dropshadows, nowhere else, the background image varies for widget boxes on the right and the overall background. The style of the icons (compare top right to social media) and also the headlines to the right vary a lot. Some of them are type, some are images.

Semantics:

The whole left main navigation is one picture. It is not optimizeable for search engines and uses an image map. No HTML5 elements are used at all, which would also improve machine readability. Headlines are not in <h1> to <h6> tags.

Readabilty:

The font for the headlines is very thick and not easy to read, especially not when it gets below 30px. In the lower corner there is even some “webfont” logo, I recommend checking out fontsquirrel.com. The background image is very noisy and too intense for good readability.

Conclusion:

I’m not mad about that my portfolio is not featured, I just point out the things that really struck me. I hope my critique is perceived in the respectful way it is meant to be.

Okay, here you go, photos: (notice the Lego logo out of small Lego figures )

There was not even time for evaluating the different objectives, because the application lists were up all the time and limited, so some projects were filled up almost immediatly. When we argued, that we couldn’t even listen to all companies and consider we got a plain: “Yes, you can.”, from one of teachers. We argued: “But what about $project_X?” and got: “Oh you can’t take that.”. We were very puzzled by that.
One of the customers changed the deadline of a sub-task to a week before deadling (which is a lot, considering we were given 14 days) and that is just not a very nice treatment of people who are trying to deliver some results that are worth being in their portfolios.
Should we get used to incoherent informations from customers right away?
Apart from the changing demands and information it’s been a good real life project so far though, but there’s always room for improvement

I see this as a violation of my privacy, because I just could have copied documents from another student and it is really nobodies business when I download which document. I refuse to use the service until this catastrophic state is removed. I was not informed about this, when I signed up for the service, which is an abuse of my trust.

Share this entry if you agree.

We did some exercises on document outlines and how <section> and <hgroup> influence them. Also the theories behind HTML5 as a living standard (as proposed by the whatWG and HTML5 as a standard as formerly shaped by the w3c were discussed. We had a complete workshop how to use HTML5 with its new semantics right now and how to provide complete backward compability.

I’ll get into that in another post, because my time-shedule is a little tight right now.

Thank you very much Jeremy for clarifying and also taking a look at our portfolios for improvement!

Following a little compilation of Corona TV commercials.

[vimeo clip_id="19363030" width="570" height="314" html5="1"]
(If your browser does not support html5 video, try the direct link)

This was my first assignment at school, it was only supposed to be 10 seconds, but I wanted to try to play with the sound effects a little.

[vimeo clip_id="19519089" width="570" height="314" html5="1"]
(If your browser does not support html5 video, try the direct link)

In this I wanted to time the different still images according to the music, please tell me if I failed

I’ve started on working with Adobe After Effects and I have some interesting ideas I want to bring to life. As mentioned on my twitter account, I have seen a couple of showreels on cromoart.de which really got me and showed me once again what I can do in the future.

One of the showreels featured on the site above I’ll link here so you get a little blood on your teeth

North Kingdom Showreel 2009 from Designchapel on Vimeo.

[de]Zum wiederholten Male: Schularbeiten. Letzten Freitag bis 12:00 hatten wir Zeit um unser Portfolio samt Bericht darüber mit ca 24.000 Anschlägen abzugeben. Hier möchte ich nun einmal zeigen was ich bis jetzt fertig gebracht habe (Ja, es kommt mehr Inhalt und dort öfter vorbei zu schauen wird sich lohnen.;)) Achja, dieses Blog wird NICHT STERBEN! Hier wird es weiter die ganzen Posts geben die nicht auf mein Portfolio gehören.[/de]

[en]Again, schoolwork. Last Friday until 12:00 we had to hand in our portfolio and a report with about 24.000 strokes. Here I want to show everybody what I did so far (I’ll of course add more content and it would pay off to either follow or take a look once a while ). I also want to tell you, that this blog will NOT DIE! I will keep this running and as you have seen before, not all the posts here would do so great on my portfolio.[/en]

[da]Again, schoolwork. Last Friday until 12:00 we had to hand in our portfolio and a report with about 24.000 strokes. Here I want to show everybody what I did so far (I’ll of course add more content and it would pay off to either follow or take a look once a while ). I also want to tell you, that this blog will NOT DIE! I will keep this running and as you have seen before, not all the posts here would do so great on my portfolio.[/da]

http://jmh-visual.com

[de]Hier ist es nun, das Dokument, das zeigt, dass ich nicht nur Webseiten erstellen sondern dabei auch ein Konzept im Kopf haben kann:[/de]

[en]Now the document that shows, that I can’t only do web sites, but also have a detailed concept in mind for it:[/en]

[da]Now the document that shows, that I can’t only do web sites, but also have a detailed concept in mind for it:[/da]

jmh-visual_report

This post is password protected. To view it please enter your password below:

Password:

Work on my final exam project has started

[de]Portfolio, den Trenchcoat aufreißen in der Öffentlichkeit, zeigen was man hat. Hier ein paar Links wie, wo, warum und wer es gut gemacht hat:[/de]

[en]A portfolio, flashing with your trenchcoat in public, showing what you have. Here a few links how, where, why and who did it well:[/en]

[da]Et portfolio, rive trenchcoaten åben i offentligheden, at vise hvad man har. Her et par links hvordan, hvor, hvorfor og hvem gjorde det godt:[/da]

Abduzeedo

• Creating a Graphic Portfolio Without a Client
• 10 Impressive Portfolio/Blog Websites

Smashing Magazine

• 50 Beautiful And Creative Portfolio Designs
• 50 Fresh Portfolio Websites for Your Inspiration
• 10 Steps To The Perfect Portfolio Website

deviantART

• massive amount of portfolio designs

[de]Wie schon zu früherem Zeitpunkt erwähnt, bin ich durch mein Studium gezwungen mich mit Flash zu beschäftigen. Die Hausaufgabe war ein paar unserer Werke vorzustellen. Dies ist hiermit erledigt und ich schließe die Applikation Adobe Flash CS5 erstmal wieder angeekelt.[/de]

[en]As mentioned before, I am forced to learn Flash in my studies. My homework was to present some of my works. This is done and I close this application, Adobe Flash CS5, disgustedly.[/en]

[da]Som jeg har nævnt før skal jeg lære Flash pga. mine studier. Min hjemmeopgave var at præsentere et par af mine værker. Det er gjort og jeg kan lukke applikationen Adobe Flash CS5 foreløbigt.[/da]

Photographer: mjranum@deviantart, Stock

[de]Das kleine Mädel hält für eine Halloweenpartyeinladung her, die andere Aufgabe war ein Typografiedesign zum Thema saurer Regen.[/de]

[en]The little girl serves for a halloween party invitation, second task was a typographic design with acid rain as the topic.[/en]

[da]Pigen tjener som eye-catcher til en Halloweenparty invitation, den anden opgave var et typografisk design til sur regn.[/da]

[de]

In den vergangenen zwei Wochen durften wir uns wie schon erwähnt, wirklichen Projekten widmen, die von Kunden verwendet werden durften. Meine Gruppe hat sich für die Erstellung einer Webseite für ein Gestüt entschieden. Darüber hinaus haben wir verschiedene Logos erarbeitet, da das bisherige Logo etwas veraltet ist und von einem Mitglied des Familienunternehmens gestaltet wurde. Vom Kunden gewünscht waren:

• einfacher Umgang mit Inhalten
• einfacher Wechsel zwischen Sprachen (Dänisch, Deutsch, Englisch)
• Bildergalerie

Wir entschieden uns für eine WordPressinstallation mit den Plugins mlanguage für die Sprachfeatures und NextGen für die Galerie. Meine Aufgabe war hauptsächlich das Design an WordPress anzupassen und das System einzurichten.

Vielen Dank meiner Gruppe an dieser Stelle, werde euch verlinken

[/de]

[en]

In the past two weeks we had the chance, as mentioned, to work on a real project, that could be used by the customer. My group decided to make a website for a horse stud family business. Further we presented logos from which one actually will be used as it looks now. The customer wanted:

• easy to manage content
• easy switching between languages
• image gallery

We decided to use wordpress with the plugins mlanguage for the multi-language support and NextGen for the gallery. My task mostly was to code the design for wordpress and set up the system.

Thanks big time to my group at this point, you’ll be linked

[/en]

[da]

I de sidste to uger har vi haft chancen at, som tidligere sagt, arbejde på et reelt projekt, som kunne bruges af kunden. Min gruppe besluttede sig for at lave en webside til et stutteri. Udover det præsenterede vi nogle foreslag til et ny logo og en af dem skal også bruges, som det ser ud nu. Kunden ville gerne have:

• en nem måde at håndtere indhold
• enkelt måde at ændre sproget
• billedgalleri

Vi installerede wordpress og brugte mlanguage til at få oversættelser på plads og NextGen som galleri. Min opgave var primært at tilpasse designet til wordpress og indrette systemet.

Mange tak til min gruppe, i bliver linket

[/da]

[de]Die Bars in Kolding haben leckeres Bier und die Uni hat nette Menschen.[/de]

[en]The bars in Kolding have tasty beers and the college has nice people.[/en]

[da]Barene i Kolding har lækre øller, skolen har flinke mennesker.[/da]

[de]MEINE Tickets für Tina Dico am 17. November [/de]

[en]MY tickets for Tina Dico the 17th of November [/en]

[da]MINE billetter til Tina Dickow den 17. November [/da]

[de]Vergangenen Sonntag (7. November) ging das Fotoevent von MeRox Studio (als Teil dessen ich mich seit heute auch bezeichnen darf), über die Bühne. Bilder davon werden folgen, sobald retuschiert. Samstag kam Halefa auch schon vorbei um sich tatkräftig zu beteiligen. Abgesehen von dem großen Ereignis arbeite ich im Moment an einigen Projekten, unter anderem an einer Webseite für die Uni innerhalb eines Real-Life Projektes, bei dem wir eine Webseite für einen wirklichen Kunden erstellen dürfen, gegen einen hohen Sold. Abgesehen von einem Eintrag über das erwähnte Event, werde ich selbstverständlich die Arbeit meiner Gruppe vorstellen, tolle neue WordPress Plugins und natürlich viele viele Fotos. Eine letzte Sache noch, über die ich mich gefreut habe, dass eine junge Künstlerin von deviantART mich interviewt hat: Videolink.[/de]

[en]Last sunday (7th of November) the photoevent of MeRox Studio (as of I from today also can announce myself a member), happened. Pictures will be online as soon as retouched and approved. Saturday night Halefa visited, helped and shot a lot. Apart from that big event I work on several projects, among them a group project where we are supposed to do a website for a real customer for no money. Further the next posts will be covering nice wordpress plugins, a lot of photos and of course my groups work. Last, but not least, a young deviant interviewed me about my work so far lately: video link.[/en]

Example rules for a team:

• import raw files without editing it
• edit non-destructive
• make copies of layers if you can’t apply an adjustment non destructively
• name layers so your group understands them without any doubt what happened in this step of workflow
• create layer groups for already correctly aligned elements or elements of same type
• export on compatibility mode for the least recent version of Photoshop used by anyone used on the project
• don’t crop the image, used guides and slices

Define these rules when you start the project and make clear to everybody, that it’s their responsibility to follow these and if they don’t, they might put either deadline or quality at risk.

Concept and Technique

Clean Code

What you should think of when starting to write a website is that you should use native html elements if possible, like h1, h2, blockquote and so on. Also very important that you devide content and style.
Bad:

<body background="#ff0000">

good:

<body> and additionally in .css file: body {background:#ff0000;}

Comments

Comments are extremely supportive when it comes to coding and learning at once, here the comment markup for HTML and CSS comments:

<!– navigation section, this is a HTML comment –>

/* multi row comments in CSS
for example: this not working in IE */

Validation

Validation is useful to get used to common guidelines. It’s not the ultimate solution, but sticking to the W3C rules is a good starting point. You can always add a browser switch for single browsers after that. (Eyeballing IE here)
Links for validation:

• HTML: http://validator.w3.org/
• CSS: http://jigsaw.w3.org/css-validator/

Also very important: remember your Doctype! (HTML5 not listed)

Sketches

Make sketches, in hand or digitally, just very roughly to define elements and layout. This will help you not to overload the page and stay focussed on your goal along the process.

Inspiration

Gathering inspiration is not really a big deal when it comes to web design. Check out the category for Web Interfaces on deviantART for example.

Resources

Editors

Important when you choose your editor is that it supports syntax highlightning.
I recommend Notepad++ for Windows and Text Wrangler for Mac OS. Linux users: You know where to go, your packet manager gives you tons of possibilities.

Browser Extensions

Really useful, they help you debug, increase your workflow (and some of them actually look pretty sexy ).
My beginner recommendations:

• Firebug (Firefox only)
• Window Resizer, Firefox version / Chrome version
• Web Developer, Firefox version / Chrome version

Tutorials

Examples for great websites that have massive collections of tutorials and knowledge:

• net.tutsplus.com
• smashing magazine

CSS References

Just a must-have for looking up how things are done and what can be done with different elements.

• CSS3.info:
  • http://www.css3.info/
• W3Schools:
  • http://www.w3schools.com/css/css_reference.asp
• CSS-Ref.com
  • http://www.css-ref.com/

Vocabulary:

• HTML = HyperText Markup Language
• CSS = Cascading Style Sheets

Thank you for reading! Leave a comment with wishes for future lessons and general feedback please!

First a little poster with a little critic about our set destination in life:

The second work is very (as in extremely or obsessively) minimalistic, focussed on used space (and the fonts):

At least you get some emails done during the 2h journey, too bad you’re going to be late for your class.

I bet I’d be off better with riding a BIKE. Well, fortunately I’ve received an offer about a flat in Kolding and I can move in in about one month.

Another thing that is kind of strange, is that the number of visitors on my blog has gone up, but I receive no comments from them at all, so either what I write is really boring or they all silently agree. My aggressive but truthful post about Adobe and Apple yesterday should be something people either should comment on or just claim that I am retorted to talk bad about their loved companies (come on Apple fanboys!).

Maybe they all think I don’t give a shit about what they think about my posts, which in a way is correct, because I’m not very unstable in my views, but in another way, I would like feedback and I also would like to read some other points of view. As I am not a well-selling star author, not a lot of people comment my posts. Maybe I should just add a huge pop-up saying: COMMENT IF YOU GIVE A FUCK. A simple JS code for something like that would be:

<script type=”text/javascript”>
alert(“COMMENT IF YOU GIVE A FUCK!”);
</script>

So, top event today: David Fratto, he held an awesome, non-stop two hours motivation speech including many nice metaphors, supplying someone anybody can look up to to my fellow students.

Not liking, even though I use them

Right now, there’s a big change in my daily life and that is using Apple and Adobe. I’ve used their technologies before, I was given an iPod (I installed Linux on) and I used PDF (which I either viewed or created with open source software). Now I am studying multimedia design and I’m using Adobes Creative Suite CS5 on my MacBook Pro. This is pretty tough for someone who actively chose to use Linux and open source software nearly exclusively.

So why the hell do you use it now?

Because I have accepted, that it’s industry standard and the market for designers on open platforms is pico (expression for small).

What’s so bad about them anyways?

They drive their monopolistic strategy out on people who have not done anything to deserve it. Apple sues programmers (keyword: jailbreak) who extend their hardware and wants the user to have no control over the product they buy. They want you to use it the way they want. They’re stepping back a little from that philosophy now, but only a tiny bit

Adobe holds its cold embrace around the internet, since they started implementing proprietary formats like Flash (I know, it started with Macromedia until they got bought).

Software patents in general are a big part of my antipathy.

What are software patents?

Software patents are a way to make money on nothing for big firms. They proclaim the right to be the exclusive distributor of a certain feature in software. A popular case of this is Microsoft claiming a patent on the double-click. You may say: Why not if they did invent it? Because it’s not complex enough. Imagine programs as math formulars, you can’t claim patents on them either. Example: I claim the Patent for PI and you had to buy licenses from me to calculate circles. Example two: I’m the first to grill spare-ribs with honey-parmesano marinade and I would sue you for trying the same, doesn’t sound reasonable, does it?

What would applying software patents mean if they were approved?

That you rarely could use any piece of software any longer. Just imagine that double-click thing. Which program does not support that? Further developers of important pieces of software that pretty much keep our modern infrastructure running would be sued and maybe drop their work, examples: PHP, MySQL, Apache.

Are you kidding me? There would be no facebook, Firefox, VLC or OpenOffice.org?

No.

What’s different about open source software?

Open source software is based upon the thought of receiving and giving back. It works quite well for a lot of companies, before you start asking how they make money with that. They often don’t sell the software itself, but support contracts. Examples on that: Novell, Red Hat. An important keyword here is the GPL, the General Public License. It states, what is released under it, is free and if you use or enhance it, that also should be free. Over 5 years ago I switched to Linux and used Windows when I wanted to play games that were not developed for Linux. Switching back to proprietary software for me is quite a deal, because it means being tied down to 2 platforms and a few Adobe products.

What can I do against software patents?

There are various sites on the internet, but if you’re living in the EU, you should sign the petition at stopsoftwarepatents.eu

What I’ve learned about homework in Integration is, that I really should keep stuff that I already have done and document it! I just finished an exercise about basic html forms. It was about alignment, the semantics of forms and how to style forms with html and css. My file may act a little as a reference because I have included the common form elements in their correct structure, like usual fields, password fields, radio buttons, checkboxes and drop down menu.

While looking around on the web a little, I have some good ideas for future forms I find mine really boring now.

• Show basic html forms demo

I’m also planning my next photo-shoot right now, but the weather has to play nice on me to work it out. You’ll probably see the pictures when they are available

(This is me, still wearing the make-up from the shooting today, had to put a little goth element in it )

Today I slept over a little and we were doing HTML basics, so I skipped my class and went straight to my photoshoot for my first assignment in my design class. I’m very thankful that Xenia gave me a hand and took the photos for me. Afterwards of course the post-work, melting the photographies together using layer masks and adding the elements for the rest of the cover. I’m getting along with Photoshop pretty well, but it’s a little hard to get along with the keybindings, that differ a lot from the GIMP.

Click the image to see them full-size on deviantART:

Today we started using Photoshop and doing some simple tasks with it. It wasn’t that hard, but a little disturbing that my books have not arrived yet. Most people around had their troubles making the Mac do what they wanted it too pretty humorous. Wel also got our first assignment today, and I’m totally excited about realising it Really have to jump into the Adobe stuff to at least be able to do what I so far learned in Gimp, Inkscape, Scribus, Blender and various more. I’ll install Gimp, just in case something is bugging me too much. So far “how to do $keyword in Photoshop CS5″ is my favourite google query. The woman (actually it’s not to bring the gender up for discussion, just to give further details) teaching us in Design is really kind, she’s just very busy and I guess I came up with some very deep or tricky questions today, but she’s helping anyways. It’s her first year, so I hope I soon can assist helping the people not really into this right now.

I also got my tablet working with some drivers that actually shouldn’t be used with it. I use a Trust TB-6300 and got these drivers for a “Slimline Design Tablet for Mac”. Well, who am I to care, it works