Hello there, I'm Aljan Scholtens

Doit.im taskmanagement

Aljan Scholtens — Thu, 03 Dec 2009 13:56:29 +0000

Doit.im is a Adobe Air application to manage your tasks. First I wrote down my tasks on paper and after that

I tried some task apps like Remember the Milk. Now I’m using Doit.im and I am loving it.

Doit.im can be installed on multiple desktops and it synchronizes very well!

- tasks

Create a task in the inbox and drag it to a category like today, tomorrow or someday!

At the bottom of the application you can add a new task. Add a title, tags and description.

In the application you can also create projects. Tasks can be easily dragged into a project.

So for freelancers this can be a great project management tool!

When tasks are completed they can be archived to easily find them back if you want to.

Deleted tasks end up in the trash and can be tracked down when you want to.

- Schedule

To schedule a task is very easy, just double click on on a task and click on the date.

There will pop out a calender. Simply select the date you want. You can also set an alarm

if you have an important task to complete in time.

- collaberation

A very nice feature is that you can forward a task. This only works if the person you forward to has a Doit.im account too.

When the other user/colleague receives the task he can finish the task and it will synchronize with my account.

All my colleagues are currently working with Doit.im, so that is very nice!

- Other Apps

You can connect Doit.im with Google Calender and I’m a Google user (Gmail, Calendar, Docs, Adwords, Analytics etc.),

so this is really helpful. And if you set an alarm on a task, it will show up on the correct time in Google Calender

Besides that Doit.im has an Android app and there will come an iPhone app soon.

I haven’t been able to check out the Android app yet.

- Download

Download Doit.im on http://www.doit.im/

Doit.im is an Adobe Air application to manage your tasks. First I wrote down my tasks on paper and after that

Before you start slicing

Aljan Scholtens — Fri, 20 Nov 2009 09:25:50 +0000

In the past few years I experienced the problem that I had to reinvent the wheel on every website. This post will help you starting to slice your website design in a consistent way and use it again on future projects.

To start, I have a basic folder for slicing a website. So every time I am going to slice a new design I just copy this folder, rename it and start immediately. Occasionally I adjust this folder because of new techniques and stuff. This is important, because using for example outdated JS files can be very frustrating for you or the programmer on the project. I am not teaching HTML and CSS here, I expect you to know basic HTML and CSS!

Folders

First, lets create some folders to organize all the assets. It is very important to put the same extensions in the same folder. For instance, put all your CSS files in a folder called “css”. This is the folder structure that I use for my projects:

css, for all your CSS files;
img, includes all imageworks for you design like backgrounds, icons etc.;
inc, extra HTML files for inclusion are located in this folder;
js, javascript files;
media, this is for photos en videos in the content;
swf, and if you use flash files, put them in here.

Be consistent. Do not capatilize the folders, this could give you problems in programming. You can adjust your folders to whatever you like, but create a structure that makes sense. Get rid of folders you don’t use. No flash means no “swf” folder.

The folders that I use most as a front-end developer are “css” and “img”, but I think that will be the same for you. If you are a programmer you might want to add a folder like “functions” or something similar.

The basic HTML

Secondly, HTML files in different projects have a lot in common. Why not make a standard template for these files as well? The first HTML file is index.html, on most servers it will be loaded as the default page. Put a doctype at the top of this HTML document, so the webserver will handle your html on every project the same.

The head contains the title, meta tags and links to the stylesheets. I’m requesting two stylesheets, one for the screen and one for printing. After the stylesheets I include the javascript files. All the programmers I work with are using jQuery and for IE6 I’m using a very nice PNG Fix, DD_BelatedPNG.js.





	Website Title

If you can’t get your website to work good enough in Internet Explorer, create a seperate stylesheet for it. This line will only be used on versions of Internet Explorer lower than version 7:

In my standard HTML document template I already stated the most common HTML elements. There is almost always a header, navigation or a place for content. If not, simply remove them. When I close an element I comment it to know which one is closed. When you are working with big HTML files you can get confused about when closing which element.

Also try to prepare for HTML5, I gave my elements classes like header and nav. In HTML5 the

will be replaced by

and

will be simply



  

    
      Header
    


    
      Navigation
    


    
      Section
      
        Article
      

    


    
      Aside
    


    
      Footer

Seperate your CSS

I am using a CSS framework, called Blueprint, for my grid and stylesheets. With Blueprint you work faster and it prevents you from reinventing the same code over and over again.

In the I call out master.css, in this CSS file I am importing several other CSS files:

reset, to set all the browsers (especially Internet Explorer) to one consistent standard;
layout, includes the basic interface elements and where they are positioned;
elements, all other elements like hyperlinks, headers, lists, tables etc;
colors, if you want to change colors sometimes, set your colors apart (I don’t use it often);
forms, for all forms and buttons.

Imagine that you only use one stylesheet on a large website project. I would really lose my focus. With multiple stylesheets I know exactly where to find the tag where I am looking for. This advantage is not only for you, but as well for others who are working on the same project as you do.

Helpful resources

I hope this post can help you to organize your design process, you can download my folder structure and the basic files to start make a start.

Organize yourself

Aljan Scholtens — Tue, 10 Nov 2009 21:05:52 +0000

Get motivated and organized to become a better designer. That is what this blog is about. A blog to help you out with your work. Think of inspiration, freebies, resources, posts about photoshop, organizing, front end web development and processes. I’m Aljan Scholtens and lets start with some organizing tips!

As a designer I need to organize myself. If I don’t, I will get stressed and forget things. In my life as designer and entrepreneur I need to be organized, so this is a small list of things that keep me organized. Maybe it can help you out too.

The hard drive

First of all, organize your PC or MAC! The first thing I did is turn off the desktop icons, all of them. Because when there are desktop icons on your desktop, they will disturb you a lot. Whenever you download something, you will place it on your desktop and it will become a mess!

I have a 2,5″ Western Digital external hard drive that I almost always take with me. So I can work wherever en whenever I want! If you do not have one, dedicate a partition on your hard drive. The root of my Western Digital exists of five folders: Projects; Documents; Music; Photography and Temporary. Do not put any other files or what so ever in the root, because you have to browse fast. By the way, I gave these folders different icons so I can recognize them faster and browse faster!

The Projects folder contains the folders for every client and it also containers folder for my administration, materials (like icons, brushes, textures etc) and other work related documents;
Documents for your private files;
Music, categorized by album;
Photography contains folders categorized by photo session;
The Temporary folder will be used a lot, it contains your downloads of fonts, textures etc.

Organizing your hard drive is a great way to keep away from stress! And back-up your folders regularly, I am using SyncBack at the moment.

Get a RSS Reader

A lot of web designers or developers still don’t use a RSS Reader. I love it! You can keep track of your favourite websites or blogs! It keeps you focused because you don’t have to go to each individual website. It saves your time!

When you have a RSS Reader and want to follow a lot of websites, create some folders. For your favourite blogs about typography you create a separate folder and for your design inspiration websites too. I’m following Smashing Magazine, Web Design Ledger and WebResourcesDepot in my design folder.

Nice RSS readers: Google Reader (I’m using it), NewsFire (Mac OSx).

Project folder

For website projects I have a standard project folder which I can copy and rename to the website name. It has three great benefits:

It saves a lot of time, you don’t have to do all the work again for every new project;
It makes you consistent, because every project folder structure is the same;
You’ll stay organized.

Make sure your project folder has a few standard folders, these are the folders I use:

The documents folder, with the briefing and contracts;
A materials folder for received logo’s, photos, fonts;
Design folder with all the website designs (try to use a versioning system);
Finally, the slice folder with the html, css, js, image files. Try to organize this too!

Plan the project

If you want a project to be successful you need to set a few milestones and deadlines. I’m using four milestones:

Strategy & Concept;
Visual Design;
Technical Design;
Transfer.

I created a complete process plan to make my clients sure what is going to happen while the project is running. For each milestone I set a deadline for myself and one for the client, a few days later. This can change for every project because it depends on the situation.

There are a lot of very good web applications to keep track of your projects. Two of the best are in my opinion Basecamp and ActiveCollab, but they don’t go for free. Starting your business, a simple and free to do list program can help you out! I’m currently using Doit.im, and another great application is Remember the Milk.

And if you prefer paper, that’s OK, as long as you just plan your work! I still have a paper agenda and a Moleskine for inspiration when I’m on the road.

Plan the day

Plan tomorrow at the end of today. It will prevent you from getting stressed, because you’re now organized for tomorrow! Write these tasks down or put them in a to do list.

I’m still trying to turn off my e-mail, RSS reader and twitter on the day itself. Please, turn them all off! It will make you much more productive during the day. This doesn’t mean that they should be off during the entire day, no, plan your day! When you turn on your mac or PC, check and answer your e-mail, read your news and if you need to, tweet. Do this a few times a day; I do this in the morning, during lunch and at the end of the day!

The famous desk

For a lot of designers it’s really hard to keep their desks kinda empty. Just do it! Otherwise, it can make you stressed. Get stacks to organize your paper work. For example, get one for clients, one for your administration and so on. This is my desk.

Put other important objects on the other side of your desk, like the old paper agenda (I’m still using it), Moleskine, sketchbook, pen, keys, phone, Wacom tablet (when you’re not using it, put it away). Just get stuff out of eyesight.

Get rid of dust! It makes you feel dirty, so clean your desk once a while with a wet lap.

Coffee

Watch out with the coffee, plan your breaks. By the way, drink water sometimes!

Aquaverium

Aljan Scholtens — Tue, 10 Nov 2009 15:32:41 +0000

Pythonheads

Aljan Scholtens — Tue, 10 Nov 2009 15:31:16 +0000

Logo WebAtoom

Aljan Scholtens — Tue, 10 Nov 2009 15:30:46 +0000

Zonnemairevakanties.nl

Aljan Scholtens — Tue, 10 Nov 2009 15:29:48 +0000

Studio Wolf

Aljan Scholtens — Tue, 10 Nov 2009 15:29:29 +0000

Creaden

Aljan Scholtens — Tue, 10 Nov 2009 15:28:48 +0000

Twit Earth, update while traveling!

Aljan Scholtens — Tue, 10 Nov 2009 15:28:14 +0000