State College Web Design | Brambling Design » Web Design

New Design Concerns

Sean — Mon, 14 Sep 2009 23:53:12 +0000

Recently, I decided to get a new computer. After much deliberation (mostly between brands), I decided on a new Dell netbook, the Inspiron Mini 10.

On the whole, I’m really happy with my decision. There are some features that I sacrifice, such as processing power, and the lack of a disk drive, but I think that the netbook makes up for that in portability. However, this is one ‘sacrifice’ that I deal with on a daily basis, and that is screen size.

My netbook has a 10.1″ screen at a resolution of 1024 by 600…slightly smaller than a standard resolution. However, despite that fact, some websites aren’t displayed correctly.

While the problem with some websites are often minor, it is still a problem that needs addressing. Since I’ve invested in my Dell, I’ve found myself designing with smaller screen resolutions in mind.

Previously, as time goes on the trend has been for screen resolutions to increase in size. However, with the increased popularity of these smaller computers, maybe we as designer need to rethink our approach. I know that I really take advantage of my 19″ desktop monitor, and fail to recognize the fact that a majority of computer users have a smaller screen.

Now I like 960 designs as much as the next guy, but I think that designers really should be careful about the content we place on the edges of our sites.

The Pros and Cons of Web Design on a Mac

Tim — Sat, 05 Sep 2009 23:03:12 +0000

Before I start this post, I just want to say, that I may have a bit of a bias on this issue. I’ve been designing on, and religiously using a mac for my entire life. That said, I’m not going to try to tell you whether Mac or Windows is better for web design, but the benefits and difficulties that arise during the design process. Perhaps later on Sean will give an alternative viewpoint on the issue, and give us the pros and cons of Windows.

We’ll start with the cons.

Cons

Internet Explorer

Yeah, Internet Explorer was on mac. It was bundled with the OS until 2003, when it was replaced by Safari. What does that mean for you as a web developer? You can’t test your websites on Internet Explorer. That is, unless you want to code it for IE5.2. That cuts you off from cross browser testing for nearly 50% of internet users. There are a few solutions though. First off, there’s IE4OSX. IE4OSX uses the WINE environment to emulate Internet Explorer 6. This still cuts you off from IE7&8 though. Our second solution is to simply put Windows on your Mac. There are a few ways to do this. One is to use Apple’s Bootcamp software. It’s a pretty useful piece of software. It partitions your hard drive into a Mac disk, and a Windows disc. This seems all fine and dandy, but it’s really not all that fun to have to boot back and forth to check how IE’s doing. You’ve also got to set up your whole web development environment on Windows anyway, to fix your site for IE. The second fix is to buy Windows virtualization software like Parallels. Parallels is a fine piece of software if your willing to shell out the money for it. It saves you a lot of trouble by letting you run Windows inside of your OSX environment.

Image Editing

Macs really don’t have a very good free image editor. Photoshop is great if your willing to pay the money, but a lot of what is so enticing about web development is that it’s something that doesn’t require an investment to get into. All you should need is time. Yes, there is Gimp, but it’s horrid to work with regularly. If your someone who doesn’t work with images regularly it’s fine, but it just wasn’t created for the Mac. There are two versions; the native version, and the XWindows version. To be honest, neither of them are particularly good. The XWindows is basically an emulation of the Windows and Linux versions, which just doesn’t work well on the Mac. The native version is just plain old buggy. Half the features don’t work, and the ones that do look weird. It’s like taking the skin of OSX and draping it over some ugly, other unfortunate program.

Pros

Software

There’s a reason so many web designers use Macs. They simplify a whole lot. There is some great software out there, like Coda and Espresso that really simplify your coding experience if you want to make the investment, but today we’re going to stick to free and open source software.

Cyberduck

Cyberduck is a great piece of software. I use it almost everyday. It’s an ftp client, that’s simple, easy, and free.

TextWrangler

TextWrangler is another great one. TextWrangler is a text editor that’s designed for web development. It supports hundreds of languages and has built in FTP support, but it still manages to function like a pro.

ImageOptim

ImageOptim is about as basic as it gets. Just put it in your dock, drop your images on top of it, and watch as their file size gets into a portion of what it was before.

MAMP

Mamp is like OSX’s verion of WinAmp, except better. It’s not that it has any extra features that WinAmp doesn’t have, or any special little catch, it just does what it says it does. It runs a local server. I’ve never had any problems with it. I run a local version of every WordPress blog I have on the internet to test everything. I’ve never had any problems yet, and don’t expect to.

My Experience with Wireframing

Tim — Sat, 05 Sep 2009 22:24:20 +0000

In the creation of our new portfolio, I decided to try a few new things. The biggest one, was wireframing everything before I even got to designing the site. I never even gave the process a second thought before I ready an article on The Importance of Wireframing by 45Royale (Who are a very large influence to Sean and I in terms of design). This is basically what inspired our new design. Some people think that it’s a waste of time, and think that they can plan everything out in their head, but problems arise from that.

Wireframing your designs is like journaling your thoughts. You take everything, put it into perspective, and can then analyze, and get input on your designs even before you make them. What first took you a few extra minutes to maybe an hour now saved you hours of work reworking your website until you’ve got exactly what your client wants.

Do you design your homepage in your image editor of choice before actually creating your webpage already? Why not take it just a step farther? Rather than plan out just a portion of your site, you can do the whole thing, and it will take a whole lot less time. Then once you’ve done that you can clearly understand your project and you can use a backbone for the rest of your project. Now you can design your homepage, then break out the text editor and code your site.

You can make things much more complex and different if you think everything through. If your anything like me, you have a few moments of great design time, and the rest of the time your working you’ve got no idea what you’re doing. This is another benefit of wireframing. Why not take one of those moments and think out your whole site. This way, rather than getting stuck on the little details, you can spend the rest of your ‘dull’ time working on the little things, fixing the little details. So get on out there and try wireframing. Just once, I promise good will come of it.

Inspiration From Nature

Tim — Sat, 05 Sep 2009 01:11:37 +0000

This is an interesting topic, that every web designer eventually comes across. We don’t think about our real original source: nature. We take everything from it. Our gradients are inspired by the sky. Silhouettes by sunrise and sunset. Many of our logos are directly inspired by our natural surroundings. As an example when Sean came up with our companies name and designed our logo, the first place he looked was outside, because that is the source for all true art.

Web designers aren’t the first group of artists be be awed by their surroundings. Look at any of your favorite artists work from any time and much of the work you see is of a tree, a lake, sunset over a mountain, or a night sky. So it comes to no surprise that web designers do the same thing.

Everything has a source. So, when all there was around us was nature, nature was what inspired people. Still our surroundings are comprised mainly of things that are not man made, and still the majority of what we do has it’s source in nature.