Can you create a website sitemap using Penpot?

I’d like to create a high level view of each page plus each section of each page. I’m new to this as I’ve been just creating and building the website as I go along.

It’ll help me to organise the flow of each page. As an example I may have the flow for a home page as follows:

  • Hero section
  • About section - Intoduce how the company solves the users intent.
  • Services
  • Benefit section - Breaks down the main problems user may have and highlight how the company solves these problems.
  • Before and after pictures
  • Fearures
  • Footer

Can I do the above in penpot? :grinning:

Of course you can. Have a look at a few beginner tutorials.

I should have included an example.

explore-designagencywebsite.png (1062×640) (octopus.do)

Can I do the above in Penpot. I wasn’t able find any tutorials. Even a mindmap would be helpful.

If you mean just the design, yes it is quite easy to make. Look up some tutorials on ‘auto layout’ and ‘components’. Basically, type some text, press shift-A add padding, a fill, then copy and paste it, add or change text, and so on.

I’m afraid I’m not seeing any tutorials that show how to build much for penpot. I’ve never touched a design tool before.

I’ve seen the first video before a few times and watched it again. This time I created four rectangles using boards and selected all and select flex box and it worked. I created these outside my main board and dragged it in.

To me this is not begineer friendly. From a seasioned figma user this is probably childs play.

I know a lot about trust forms in the UK aside from building websites. So if you asked me to help with with a trust form and I just said look at videos and google. You may get there in the end but you may not know if the info is correct.

You give me the impression you know Penpot, I’ve asked if someone can create the penpot website and show the thought process.

Are you willing to do that?

1 Like

There are more than enough videos out there on how to design simple objects with auto-layout and text. I have neither the time nor the ability to explain it better than any of the existing videos.

I just wanted to thak you for your help :grinning: