Looks like a 4yr old did it

https://codepen.io/jennifer-maldonado/pen/OJygReG?editors=1100

This project has been taking me awhile to finish. I have gone through different designs, and I have learned so much while building it… but, I just can’t help but look at this and think… What am I doing?? It looks so jumbled, am I ever going to get this!!!

I tried being positive, and even looked at my older projects and I can’t believe how far I have come! but I am feeling overwhelmed with the fact that I still have so much improvement to master. I havent even started JavaScript!

Maybe this just isn’t for me… I was going to put this under project feedback, but maybe I just need some motivation. Help!

4 Likes

Your design is really cool! You’ve got a great start! Now you just need to focus on getting the tests to pass.

You really think so? I may be a little too hard on myself, but I should have picked a better color scheme. Something that will blend together a little better. Any suggestions? I was trying to go off of the picture in the back.

I don’t think it looks bad at all. Don’t be so hard on yourself

1 Like

Doesn’t look horrible and works, and odds are a four year old couldn’t do it so its at least better then that.

However, if you feel like you have room to improve then your right. That isn’t a bad thing, rather that is how your going to feel most of the time, it is the norm. To put it simply if you feel 100% satisfied with your skills then you will start falling behind. There is and always will be more to learn and more to grow.

Now when it comes to design, skills it can be said it takes practice to get good, you don’t magically know HTML/CSS and how to make excellent designs. Some people just don’t have the eye either, as design is very much like art, where beauty is in the eye of the beholder.

The goal isn’t to become a master this early on, its to become aware of how far you are, and how far you can go. You don’t need or want to become a “specialist” without understanding what else you can learn, as you might find you just hate design, and like programming better. Its better to be a generalist then a specialist when starting out so you keep your doors open and get more awareness to the entire ecosystem.

I’d continue diving into JavaScript, as programming is its own challenge on its own, and it is very much harder then HTML/CSS.

However, that isn’t to say your not cut out for it. If you learned HTML/CSS, then there is nothing stopping you from learning JS. Programming is a more complex area as it not only has syntax (just like HTML/CSS) but also deeper concepts beyond just the syntax. I’m sure you struggled thru learning HTML/CSS, and you will struggle thru learning JS, everyone does and everyone will. The main thing to understand is you only fail if you choose to do so, give it time, grit and tons of googling and you will get thru it step by step, challenge by challenge, bug by bug. Day 1 might be just as hard as day 1 million, that’s the nature of programming where you can spend hours figuring out your code any day, regardless of skill level.

Sounds like your doing just fine so far. You have a project to show, it shows progress in skill and grasp of the concepts. It might actually be a bowl of spaghetti code thrown together, but if it works it works. Knowing that it can be made better is more important than actually making it better. Perfectionism is the enemy of progress, take what you have, take what you’ve learned and continue learning new things, and tackling newer challenges. You can always build upon what you’ve learned to make the next project bigger and better. Just strive to improve :smiley:

Your just getting started, and as long as that doesn’t scare you, then your well on your way :smiley:

Good luck, keep building and keep learning!

9 Likes

I loved your post so much I read it twice. Thank you so much!!! I will complete this project and the next one, will be that much easier… and if not? Then maybe I just have to have fun with the process. Thank you again!

3 Likes

sucking at something is the first step towards being sort of good at something

8 Likes

Very succinct :slight_smile: :slight_smile: Kinda the short version of the other reply…

1 Like

I needed the laugh! thank you <3

I’m very confused with the title.

Congrats on the progress so far, Jennifer. I don’t think your design looks that bad… it could obviously improve but have clearly got to grips with how to use CSS which puts you a million miles ahead of a lot of people (myself including). I’m still struggling to get elements structured in the way that I want.

If you want to improve design skills then I would suggest downloading something like Figma or Sketch and taking a basic course in design for a tenner online. https://designcode.io/ is a really good resource to get started

1 Like

I don’t think it’s bad at all! I think on the design aspect we can learn from web designers or UI/UX engineers. I found these tips on Twitter: https://twitter.com/i/events/880688233641848832?lang=en
May it be of benefit :slight_smile:

1 Like

I’m only seeing it on mobile right now which I’m sure doesn’t do it justice, but it certainly doesn’t look bad - btw the price boxes are especially cool!

The tribute page took me much longer than the other tasks as well as there’s a lot more in it - one thing I found useful was:

if a div or section or grid or whatever was just not working for me, I would highlight the
whole section in my stylesheet and comment it out (on VSCode the shortcut is ‘Ctrl+K+U’).

Maybe I had I overcoded it, added in too many styles I didn’t fully understand, using a tool that wasn’t right… I actually ended up commenting out the whole page at one point early on and styling from scratch!

That way I could try working on it a different way, experiment a little, but my work up to that point was always safe and sound sitting at the bottom of the page for me to revert to if I needed.

Not sure if it will be helpful but just an idea! Either way, keep going, it’ll click soon :slight_smile:

1 Like

I don’t think your design is bad at all and you should not be to hard on yourself. You should have seen some of my early attempts. Trust me your project looks like a masterpiece in comparison! But also trust me when I say this, if you continue to practice, learn and keep building projects you will get to a point where you will be able to build some amazing stuff. You have to look at all of this as baby steps. It is not an overnight process and the material you have to learn is difficult. Stay in there. The reward at the end of the tunnel will be a great accomplishment and you will get to a point where everything starts to click.

Sorry for the late reply, I checked the site out. Your layout was really good, in fact I was really impressed with it. The main issue is color selection, it contrasts too much and at some point contrasts too little. In addition, the background image is distracting. I suggest removing the background image and changing it with color, and experimenting with some color scheme. In addition, fix the form color layout as well. Don’t worry much, my first site looked like an infant made it as well. Another thing to do is design the site using figma or XD, it will give you a roadmap to make the site better. Happy coding, cheers!

It’s really a pretty great tribute page, in that it’s laid out really well. Honestly my only criticisms might just be color/font choices. They don’t look like a 4yr old did it, to me it just looks a little dated in its color and font palette.

Check out : https://www.w3schools.com/colors/colors_compound.asp It’s a little tool for looking at different color palettes. After going there for inspiration I also enjoy playing around with this:
https://coolors.co/ which is another tool that helps you pick an interesting color palette in a fun way and save the colors for future use.
I also enjoy perusing the Google fonts for fonts I like, then googling recommendations for a second font that complements the first one.

Final recommendation…go look at some webpages. I like to spend a little time looking at similar pages for whatever kind of business/project I’m working on to get an idea of what kind of visuals/layouts are common. If I see something I like (that’s simple enough to do in CSS lol) I may not just rip it off whole sale but see how I can recreate it.

I am NOT that far ahead of you (studying JS now) and not an expert, but those are my 2 cents.

Also, I had to look at your code to see how you made those boxes with the skewed corners…very simple but neat.