Line In Web Design

Illustration 25: Voyage Travel Apps Logo

Simon — Thu, 17 May 2012 16:00:00 +0000

The site logo/header for our new iOS app website, Voyage Travel Apps.

We’ve already released our first app and we’re hard at work on our second which we hope to have ready in a month or two.

Illustrator iOS Template (including iPad 3)

Simon — Tue, 15 May 2012 16:00:01 +0000

Download my free Illustrator iOS template.

Since moving into iOS development, I try to do as much of my artwork in vector so that it’s easy to scale, usually moving in to Photoshop to add effects and pretty it up.

To speed up my workflow and to remind me not to forget any of the numerous icons you’re supposed to provide for apps, I’ve created an Illustrator template to help get me started, which works in conjunction with a Photoshop template that I’m still developing (but, thanks to Jon Hicks, now has very precise Vector masks with the correct corner radii).

Using the Illustrator iOS Template

All of the artboards in this illustrator iOS template have been sized and named according to Apple’s interface guidelines should you decide to go direct from Illustrator to Xcode (although Bjango’s Marc Edwards doesn’t recommend it).

However, by default, Illustrator exports the files as “documentName_artboardName.png”, which would usually mean having to tediously remove the “documentName_” bit from each of the exported files but, thankfully, Matthew Ericson has created a super useful script that solves this particular problem.

This script overrides the naming default and allows you to save everything out using just the artboard name, which means everything comes out ready to drop in to Xcode.

I would also recommend switching on Pixel Preview (Cmd + Alt + y on Mac) so that you can line up your vector shapes to the nearest pixel. This will make it easier to get pixel perfect pasting when moving between Illustrator and Photoshop.

See this excellent article, again by Marc Edwards of Bjango for more about this.

License

I’m releasing this illustrator iOS template as Freeware, so feel free to download it and use it however you like. You can use it for any of your projects without restriction and you don’t have to give me credit (though it’s always appreciated).

Missed Business Opportunities

Simon — Tue, 24 Apr 2012 16:00:59 +0000

While motorbiking around the island of Koh Jum (pictured, featuring one of the stunning sunsets we witnessed), we visited a cafe that was part of a larger resort. The cafe was overlooking the pool, which was entirely empty as it is currently coming in to the low season in Thailand. We had our swimming stuff with us as we had planned to hit the beach but the pool was becoming more enticing.

Some hotels have a policy of charging outside guests for use of their pool and we were more than willing to pay for access.

After ordering a large lunch at their restaurant, we inquired whether we could use the pool.

‘No,’ came the gruff reply.

Please Let Me Give You Money

It reminded me of another situation that I recently had with my hosting provider. We had a fixed bandwidth allowance which had been more than adequate up until that point. That was until one of our posts on Never Ending Voyage was shared on Stumble Upon. The resulting traffic crushed our server and our users ended up facing Bandwidth Exceeded notices.

I had read their hosting terms and conditions and was under the mistaken impression that they would simply charge us extra for the overage but apparently it didn’t apply to their shared hosting packages.

A few frantic emails later and we had upgraded our plan with the promise that we just had to email them again if we needed to increase the limit in future. This was an improvement to the situation, but still less than ideal. I can’t think of a good technical reason why, since they’re already tracking usage, they couldn’t have a script that works out how much I went over at the end of the month then bills me for the difference:

float charge = ( totalBandwidthUsed - monthlyAllowance ) * overageFee;
if ( charge > 0 ) calculateAndSendBill( charge );

Missed Business Opportunities

In both these situations, I was a customer that would have been happier if I had been given the opportunity to give these providers money. Surely the ultimate win/win?

It did make me think: Are their opportunities for not only increased income, but more importantly increased customer satisfaction, that I’m missing because of an inflexible policy?

Illustration 24: Hotel Checklist App Icon

Simon — Thu, 19 Apr 2012 16:00:57 +0000

I recently finished and released my first iPhone app. It’s called Hotel Checklist and this is the icon that I designed for it.

It was designed to help backpackers decide between hotels when they land in a new place and are looking for a place to stay. It’s a simple app at the moment but if there’s enough interest, then I’ll add more advanced functionality in future.

Given it’s illustrated nature, I’m including it as part of my Illustration 156 project.

Sketchbook Sunday: 31 Characters in 31 Days

Simon — Sun, 15 Apr 2012 16:00:03 +0000

For the month of march I took up the 30 Characters challenge. The idea of the challenge is that, for the month of November, you draw a new character every single day for that month.

I only found out about it recently and I didn’t want to wait until this November so I decided to do it for the month of March so my challenge is actually 31 characters in 31 days.

I’ve posted a few of them on the site already, but this week I have collected all 31 characters together in a nice spangly gallery.

31 Characters in 31 Days

The quality varies wildly from ones that I’m very proud of to embarrassing wrecks but they all have value in that they forced me to draw for 25 minutes every single day without fail. It’s a habit I now have and that I don’t want to lose.

Setting Up Virtual Hosts with MAMP on Mac OS X

Simon — Tue, 10 Apr 2012 16:00:16 +0000

I’ve been using the regular MAMP for a long time without problems but recently I wanted to start experimenting with subdomains on my local development server using Virtual Hosts.

I knew that MAMP Pro supported Virtual Hosts and so I fired up the trial and indeed they do make it very easy for you to add new host names: simply add a server name and a directory for your files and you’re good to go. If ease and convenience is important to you, then just get the Pro version and be done with it.

However, I like to know how things work and so, after a bit of poking around in my /etc/hosts and the various httpd.conf files in both the /Applications/MAMP and /Applications/MAMP Pro directories, I found that it was actually pretty straightforward to add new virtual hosts manually.

Adding Your New Domains to the Hosts File

Throughout this post I’ll be using the example domain name line-in.local.

Open up a terminal window and make a backup of your hosts file by typing
```
sudo cp /etc/hosts /etc/hosts-backup
```
(as this is a system file, you’ll probably need to enter your password)
Edit the hosts file in Nano by typing the following:
```
sudo nano /etc/hosts
```
Near the start of the file, you’ll see the line: 127.0.0.1 localhost. You can simply add your new domain to this line so that it reads:
```
127.0.0.1 localhost line-in.local
```
I also added each of my domains to the IPv6 version (which is declared a few lines later), so it looks like this:
```
fe80::1%lo0 localhost line-in.local
```
This is a good idea because there are reports that OS X Lion’s DNS cache is a bit rubbish. I found that it was taking up to 5 seconds to resolve my new domain names. Adding the domains to the one line seemed to help fix this problem).
Ctrl + x and then y will write out your changes

Preparing the Virtual Hosts in Your httpd.conf File

Go to your MAMP application folder and find the configuration files for Apache. It should be in /Applications/MAMP/conf/apache/ For my version of MAMP, they use includes to separate out some aspects of the configuration files including virtual hosts. This seems like a nice way of keeping things organised and allows you to easily play around with virtual hosts without messing up your main httpd.conf file so that’s what we’re going to do here.
Open up httpd.conf and scroll all the way down to the bottom. You’re looking for the line:
```
Include /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf
```
It might have a # symbol at the start, meaning that it’s commented out. Delete that symbol. If it’s not there at all, simply add the line.
Save and exit out and go back into the configuration folder (/Applications/MAMP/conf/apache/). If you have a subfolder called extra, open that up. If not, create it.
Open up httpd-vhosts.conf. If it doesn’t exist, create it. If you didn’t create it yourself, you might see some example dummy hosts in there. You can ignore these or delete them.
If the following line doesn’t exist in your file, create it:
```
NameVirtualHost *:80
```
The first thing we have to do is to create the default configuration. This is what Apache will use if it can’t find a server that is pointing to your localhost IP address but hasn’t been declared as a unique virtual host. Copy and paste this:
```
DocumentRoot "/Path/To/Your/Default/Document/Root“
```
Replace /Path/To/Your/Default/Document/Root to the path where you store your web files (default in MAMP is /Applications/MAMP/htdocs, but you may have changed this).

Adding New Web Document Roots

With virtual hosts, you can use different folders for different document roots. For example, I have a web design clients folder and I hold all of my web files for that client in an individual webroot folder within that design folder. This makes archiving and organisation easy (though if you do move the folder, you’ll need to remember to update the Virtual Hosts file).

Create a new folder for your virtual host somewhere on your system. Make a note of its location. You may also want to add a quick index.html file to that folder which will tell you if it’s working or not.
Copy out the following into the httpd-vhosts.conf file, underneath the first VirtualHost declaration:
```
DocumentRoot "/Path/To/New/Document/Root"
ServerName line-in.local

    Options All
    AllowOverride All
    Order allow,deny
    Allow from all
```
Important things to note:
1. The ServerName should be what you set your /etc/hosts declaration to (in this case, line-in.local).
2. Virtual hosts can contain most Apache directives. For directory-specific directives, create a new declaration. You generally want to copy your set up from your main Apache directory configuration (see httpd.conf) so that things work consistently across all of your hosts. One important declaration is AllowOverride All. This allows you to use .htaccess files in your new directory.
Save this file out and restart Apache. If everything is working, you should be able to open your browser and go to your new host (e.g. http://line-in.local) and it should open up the index.html file you created.

Congratulations, you now have a working virtual hosts set up!

You can add as many of the declarations as you’d like, just remember to update /etc/hosts for each new domain you want to add.

Troubleshooting

Everything went smoothly following the above for me but your mileage may vary, especially if you are using older versions of MAMP or have heavily configured your httpd.conf file.

If Apache doesn’t start at all, check your httpd-vhosts.conf file for errors (make sure the closing quotes match, that you’ve closed all open directive tags and that you’ve spelled the directives correctly). If you just can’t get it to work, you can always open up your httpd.conf file and comment out (with a #) or delete this line:

Include /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf

This will effectively ‘turn off’ your Virtual Hosts configuration and get you back to a working development server.

Sketchbook Sunday: Zombie Dave

Simon — Sun, 08 Apr 2012 16:00:17 +0000

Zombie sketch!

I recently purchased Zombieville USA 2 by Mika Mobile for my iPod touch. It’s a great little game–I particularly love the art and animation and it got me all inspired to draw this fellow whom I’m naming Dave.

He’s another one of my characters from my 31 Characters in 31 Days challenge. I’m still in Burma right now so the gallery round up post will hopefully appear next week.

Illustration 23: Grogmonkey

Simon — Thu, 05 Apr 2012 16:00:33 +0000

For my little brother.

Happy birthday bro.

Sketchbook Sunday: Sal

Simon — Sun, 01 Apr 2012 16:00:15 +0000

I’ve always struggled a bit with drawing females. I think drawing beautiful women must be one of the hardest things in the world to draw. This sketch is the closest I’ve ever come.

Sal appears as one of my 31 Characters in 31 Days challenge which ended yesterday. Unfortunately, I’m in Burma right now so I wasn’t able to put together a round up gallery post with all of the characters from March.

Hopefully I’ll have that done in the next couple of weeks.

Sketchbook Sunday: Doctor Dan

Simon — Sun, 25 Mar 2012 16:00:55 +0000

Sketchbook Sunday continues with the sketch of this handsome and charming doctor, Doctor Dan. He appears as one of my 31 Characters in 31 Days.

So far the challenge has been quite the mix, featuring some of the best sketches I think I’ve ever done and also some more questionable efforts.

I do feel like I’m improving greatly, though. Practicing something every single day without fail, even for as little as 25 minutes, is so much better than trying to do three or four hours once a week.