馃摋Looking for blog site design feedback - Home page (draft 1)

Hung Vu - Nov 2 '22 - - Dev Community

Hi all, I'm in the progress of building a new self-hosted blog site. I'm not really well-versed in web design, so I figured it will be better to gather feedback from the community. The first draft is shown below.

hungvu.tech - Home page - rough draft

For context:

  1. This is my first (serious) try using Figma.
  2. My goal is to have a minimalistic website, while not being so bland. I'm not fond of excessive effects or animation.
  3. This is my first draft.

Here is some information regarding the current design:

  1. Font is Roboto.
  2. Font sizes are 32, 24, 16, and 12 depending on the content.
  3. Border radius is 24.
  4. Spacing is based on a 4 pt. grid. The common gap distance is 16, and 32.

Here are some of my questions/concerns:

  1. I use Roboto because it is a de facto choice for the initial design, but it is a bit generic to me. What are other alternatives?
  2. Is the Hero section kind of bland (waste of space)?
  3. What would be a way to make a smooth transition between sections (e.g., from Hero to All Articles)? At the moment, I feel like they are visually disconnected.
  4. I feel like the article section is clustered, or is it?
  5. For the article filter, how should the choices be presented when there are multiple of them (for visual, and a11y)? For example, 10-choice is 10-row, or drop box, or something else (like Tags filter)
  6. I prefer a website with a neutral theme, so there is no light/dark mode. Or do I still consider a light/dark version of a neutral theme?

These are on top of my head at the moment, any other feedback is greatly appreciated!

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .