Annoyed and downhearted at myself, common problem when designing?

Same here. I got a good grasp on HTML and CSS but i cant seem to plan out anything great. I just stare at my code and have no idea what should i do.

Just a suggestion: try getting a pencil and some paper and play around with them. Use drawing to help you visualise what you would like your page to look like. And then go and think about how you could code that.

Every artist in any medium goes through this. You are an artist, no matter how experienced. Any sort of design for the web is art. You'll always have times where you hate what you've created and get down on yourself about your talents.

Your art is going to improve the more you work on it, plain and simple. Gotta just keep pushing forward through the bad ideas and self doubt. Probably the most important thing to remember is that you'll never be completely satisfied with your work. Websites especially don't get finished, they just get released. Don't nitpick yourself forever. You'll never finish anything that way. What you've made so far is probably way better than you're giving yourself credit for.

Keep at it! :)

Scott, the best things that have worked for me is to design something. And then totally trash it. Start fresh. After about 6 or 7 revisions, and maybe combining some revisions, my masterpiece is complete.

I also don't have an artistic bone in my body, but professional designers never get things right on their first try either. It's just something you have to realize. Take your idea for the website... and throw it away. Start totally new... rinse and repeat about 6 times.

• I agree with Paul Byrne. you need play a bit before getting your hands on code. :)
• Agreed, Chris Zabriskie.

Thanks guys great advice really appreciate it

I think the problem I have is trying to be please myself to much and so I will keep hacking away but that may be a vicious circle.I originally showed the boss the header area and he said he liked it so should stick around that.

as a learner I suppose some my work will be more basic till i learn more so i may be trying to run before i can walk, after I have done this project I will work on various elements that will complement designs I have bought a new slr camera and will get myself taught up on on photoshop.

I should also practice on some headers, boxes and footers and other elements more simple and little projects than full sites.I do need to practice my drawing skills as they are zilch at the moment.

I just need to take a step back and make learning fun instead of putting myself under pressure to perform.

Don't try to code too much of your design. Definitely use something like Photoshop or even just try sketching it out.

Agree with all of the above.

FIRST, GET SOME SLEEP --no matter how frustrated or behind you are, if you are burning the candle at both ends, you'll never solve the problem. Giving-up 2 hours of work for a nap (or coming back tomorrow) will be much more productive than wasting another week.

that said... When I'm stuck, I like to take a step back and say, "okay... who is the end-user? Why are they on the site? How did they get here? and What info do they want? What are the business goals? How do I get those people to move towards the business goals?"

It looks like you maybe did that already... but there's another reason to go back to that.

It helps to look at your priorities and puts the business' goals back into the spotlight (not so much our design or our artistic ability). If I know that the business want's to show each week's featured vegetable at a low price, I might focus on putting some images and text to highlight the specials and promotions... However, if the shop specializes in local, organic ingredients, has a higher clientele and price point, I may want to focus more on beautiful product photos and possibly on recipes (in case you only know how to do 1 thing with fennel, for example).

Example 1: is a commodity and price focus, and should probably be full of bright colors, big text, and calls-to-action (buy now, sign up for this service, get on our coupon email list, etc.)

Example 2: might focus more on the ingredients, cooking culture, recipes, videos, etc. -- it might have more of a monochromatic or analogous color palette, focusing on the product... relying on grays and/or warm neutrals to highlight the bright images.

If the business goal is to buy online, lead them to the shopping cart. If it's to sign-up for a weekly veg-delivery service, take them to the sign-up form.

I know that this doesn't specifically tell you how to make a breath-taking design... but if you start with the customers and business goals, it can go a lot toward helping you identify what NOT to do... which is a few steps better.

You can also google "web design gallery food blog" or "Web design gallery organic food" or "web design gallery e-commerce" ---- using those as a starting point to get inspiration will also help.

when I get stuck -I find it's usually the result of not having a clear vision of what I need to accomplish. If I know the market and business goals, I have an inherent starting place, from which I can either jump-in, or do some research.

ALSO -- don't hesitate to post some links to images and ask for some critique!

[I don;t know your level of experience, so disregard if you know all this... but if you use a grid-based system to code with, you can set-up Photoshop or Fireworks with a template that shows the cols and gutters... and use that as a way to snap-in the design. -- a solid color palette, a grid-based design, decent use of type, and some good photography are really the elements of a nice-looking design. - if right-braining-it is leaving you frustrated, sometimes switching over to the left brain and logically doing it will get you there too.]

You may have done things in reverse tbh. Its very difficult to jump straight in and code an awesome looking site without having a thorough understanding of design first. Before I started to code front end, I spent years refining my design skills. I used to just hand my PS design to the developer who turned it into code. This made the transition from design to front-end code easier for me. I could not imagine starting to learn to code a design first without having a foundation of design knowledge. My tip? Turn away from the screen, take a pencil and paper and start sketching rough layout wireframes! Once your happy enough with an idea open photoshop and play around with it. Its easier to change things in photoshop quickly than recoding an entire page or making incremental changes to a page.

With regards to the confidence issue? Don't even sweat it! Every designer/artist has a crisis of confidence from time to time. Every designer struggles with inspiration from time to time too! The cure for this is the same as the cure for being down and the dumps! Get sleep, eat well, get out and get some exercise! Working on another creative project is great way to get the creative juices pumping again and can often lead to a moment of inspiration for the problem project! If you have an idea for a web project you want to work on then do that! Got a camera? Get out and start snapping! Have a pen and paper? Start writing! Have a pencil? Start drawing!