Question for the Designers

[Solitude]

I'm a programmer and all the websites I've built I've used themes or just plain Bootstrap.

My next personal project I would like to create the theme myself. Now, I know CSS and all that but the actual design of the graphics and stuff is something I know very little about.

How would I go about it? What software do you people use?

I saw some people design the whole site in Photoshop and then cut it out and create a theme from that. I also saw that a program like Xara Designer Pro allows for the creation of graphics and the website itself but that looks like overkill. And yes, I'm not prepared to pay for Photoshop but I'm prepared to pay for Elements if there isn't anything better.

And then there's all the vector illustrator type software which in my opinion looks like the better choice.

Or I can just pay for a designer to do it but I have no idea what they ask and what the process is.

I'm only at the start of the research now but some pointers to start with would be great.

To [MENTION=5134]MalicE[/MENTION] and other designers.

 

[BeoTeK]

Keep us in the loop, I would like to see how this evolves as I am now going through user experience design.

I am starting to work with Balsamiq for wireframing. But when I played with web design I used to use a combination of Dreamweaver and Fireworks, both worked hand in hand.

 

[MalicE]

ok. so if you REALLY want to build a site from the ground up, I can only recommend Dreamweaver. It has come a long way since Adobe bought it.

The actual graphics you can do in pretty much anything. but not MS Paint. Never MS Paint.

vector graphics are pointless as this is for digital use so don't even bother cause you won't find a lot of freeware vector design software.

I still prefer WP with a custom theme. it's very easy to find a theme you like and mold that into what you want. but that's just me. I have gotten lazy when it comes to site building.

give me a shout if you need any assistance

 

[BeoTeK]

the actual graphics you can do in pretty much anything. But not ms paint. Never ms paint.

Vector graphics are pointless as this is for digital use so don't even bother cause you won't find a lot of freeware vector design software.

gimp?

 

[MalicE]

gimp?

to name but one yes. but nothing really beats photoshop

 

[Solitude]

ok. so if you REALLY want to build a site from the ground up, I can only recommend Dreamweaver. It has come a long way since Adobe bought it.

Ideally I would like to lay out the site in Bootstrap and then modify the Bootstrap theme and add graphics where necessary. Dreamweaver is an expensive option but I'll have a look, thanks.

The actual graphics you can do in pretty much anything. but not MS Paint. Never MS Paint.

Ha yeah maybe it's my skill in creating graphics that's lacking. I think I may have to hire a designer to create the theme graphics that I need.

vector graphics are pointless as this is for digital use so don't even bother cause you won't find a lot of freeware vector design software.

What about the software at http://www.serif.com/ ? The site doesn't want to open for me at the moment.

I still prefer WP with a custom theme. it's very easy to find a theme you like and mold that into what you want. but that's just me. I have gotten lazy when it comes to site building.

Hmmm that's actually an option. Take an existing theme and edit it. That may actually save me a lot of time. Thanks for the idea!

give me a shout if you need any assistance

Thanks!

 

[MalicE]

Ideally I would like to lay out the site in Bootstrap and then modify the Bootstrap theme and add graphics where necessary. Dreamweaver is an expensive option but I'll have a look, thanks.

It doesn't have to be.... "whistling:

Ha yeah maybe it's my skill in creating graphics that's lacking. I think I may have to hire a designer to create the theme graphics that I need.

Like I said, let me know. I'll give you the family discount

What about the software at http://www.serif.com/ ? The site doesn't want to open for me at the moment.

honestly don't know them at all. but if you can pick it up for cheap then why not.

 

[Solitude]

It doesn't have to be.... "whistling:

Like I said, let me know. I'll give you the family discount

honestly don't know them at all. but if you can pick it up for cheap then why not.

Haha yeah no I can't pirate.

Thanks for the family discount!

I'll keep you guys updated.

 

[Apollo]

Dreamweaver is just the lazy man's Notepad++

 

[BeoTeK]

Dreamweaver is just the lazy man's Notepad++

hahaha.... rep+

 

[MetalSoup]

Dreamweaver is just the lazy man's Notepad++

That may be, but then pretty much every programming language is just the the lazy man's Assembly, and a car is just a lazy man's bicycle.

Why would anyone want things to be more work or more complicated than they need to be?

 

[Solitude]

That may be, but then pretty much every programming language is just the the lazy man's Assembly, and a car is just a lazy man's bicycle.

Why would anyone want things to be more work or more complicated than they need to be?

I know of a developer that used to work here who basically reinvented the wheel the whole time because he wouldn't make use of libraries.

It boggles the mind.

 

[Avatar]

That may be, but then pretty much every programming language is just the the lazy man's Assembly, and a car is just a lazy man's bicycle.

Why would anyone want things to be more work or more complicated than they need to be?

+1. I like being lazy. If you can get something doing with half the effort, you've saved half the effort!

 

[Solitude]

Wait, [MENTION=17]MetalSoup[/MENTION],

Aren't you a designer too? Have you got any tips regarding the questions in the first post?

 

[MetalSoup]

Wait, [MENTION=17]MetalSoup[/MENTION],

Aren't you a designer too? Have you got any tips regarding the questions in the first post?

I do pretty much everything web related in Dreamweaver. I use Photoshop if I need to create web banners or edit photos, and Illustrator to create logos or printed material.

 

[Solitude]

I do pretty much everything web related in Dreamweaver. I use Photoshop if I need to create web banners or edit photos, and Illustrator to create logos or printed material.

Thanks. All the expensive stuff!

When you guys start a new website (Sorry I know you are a busy person), do you start immediately in Dreamweaver and create the whole thing from there?

 

[Avatar]

Just FYI, I've been wondering all this myself lately, and I've got no idea how to edit a WP theme that [MENTION=5134]MalicE[/MENTION] says is all easy. So I'm following this thread closely too, it's not just for Solitude's benefit!

 

[Apollo]

That may be, but then pretty much every programming language is just the the lazy man's Assembly, and a car is just a lazy man's bicycle.

Why would anyone want things to be more work or more complicated than they need to be?

It's down to personal preference. I just feel more comfortable coding the page in Notepad than in Dreamweaver. Besides it's not that difficult or time consuming if you use the same properly set up CSS. Then again, 90% our pages consist of script and 10% visual.

 

[BeoTeK]

It's down to personal preference. I just feel more comfortable coding the page in Notepad than in Dreamweaver. Besides it's not that difficult or time consuming if you use the same properly set up CSS. Then again, 90% our pages consist of script and 10% visual.

I'm kinda the same. I would usually design and everything using Dreamweaver, then open it up in N++ and just do some housework and cleaning up (sorry, I like neat code)

 

[FarligOpptreden]

ok. so if you REALLY want to build a site from the ground up, I can only recommend Dreamweaver. It has come a long way since Adobe bought it.

The actual graphics you can do in pretty much anything. but not MS Paint. Never MS Paint.

vector graphics are pointless as this is for digital use so don't even bother cause you won't find a lot of freeware vector design software.

I still prefer WP with a custom theme. it's very easy to find a theme you like and mold that into what you want. but that's just me. I have gotten lazy when it comes to site building.

give me a shout if you need any assistance

Inkscape? Best vector editor I've ever used.

Anyway, they key to modern web design is minimalism and light weight. There are tons of great resources for iconography (Google's Material icons and Font Awesome for example) which should be readily themeable with CSS. Don't do cutups from static designs, you'll quickly run into issues when designing responsive sites. Just plan ahead properly and investigate common practices in the type of site / application you're trying to build.

On the graphics side of things, if you design and export illustrations in SVG format and directly embed the markup in the page, you can further theme (and animate) the illustration using CSS and even manipulate it with JavaScript and jQuery. Most charting libraries already leverage this and it really is a powerful, underused technique.

Finally, try and use the HTML5 canvas element for some stunning designs and accents to your site (pro tip: you don't need just one canvas on the page, each one has its own drawing context). You can give a site a really nice organic, lively feel by implementing some subtle animations and interaction using the canvas.

Oh, and Bootstrap is boring as hell. I refuse to use it. I need to give my work some identity.