How do you handle design when working a project that doesn’t have explicit design guidelines?

I’ve been working on some personal projects, but I am continually getting held up on design. I hate looking at a blank page, not knowing where to start. I’m not a particularly creative person in art and design and I really struggle to come up with new ideas on my own. I don’t enjoy it.

I’m the kind of person who buy 10 plain black t-shirts and 5 pairs of plain jeans so I never have to think about style.

I’m sure there are a lot of us out there; you can make the thing but, not design it. How do you work that part of the process?

I don’t want my projects to get skipped over because they’re ugly and I don’t want to copy other designs pixel for pixel.

  • AnAngryAlpaca
    3•8 months ago

    It’s actually not that hard, because the web is mature, and there are some conventions you must follow so users know how to use your site.

    Start with a framework like bootstrap (general websites) or AdminLTE (backend panel type sites) or whatever your prefered frontend libary is. Look at all the example pages and components the framework gives you. Think about which components you need for your system, and how you want to present and interact with the information.

    There are some bootstrap visual builders out there, so you can experiment and try different layouts and ideas to give you a feel for layouts, sizes, propotions before you commit and code a layout.

    Then think about the general structure of the website, and what the user knows and expects from other sites. Look at other sites with a similar topic, then think about what you like and dislike about this site, and how you would make it better. Go with a common, basic and understood structure and navigation, which in most modern sites is generally:

    -> Homepage (latest/interessting stuff)
    -> Index/Category (all items of the same topic, all posts in a blog category, all products in the category “phone” etc.)
    -> Detail page (a single blog post with it’s comments, a single product with all its pictures and properties etc.)

    Design as simple as possible. Make sure the user can accomplish your business goal (ordering a product, fill out a contact form, …) with as little input, clicks and efford as possible. Make sure your business goal can be reached from everywhere on your site by placing a big link in the main menu that is always visible.

    You can also throw your ideas into chatGPT and ask it to design a bootstrap portfolio template for your personal blog, and then build and expand on that.