How-To-make-mockups.md
ASCII text, with very long lines (337)
title: How to Make Scratch Mockups date: 2021 Apr 22 updated: 2024 Jan 3
The first step to making a mockup is to open the DevTools. This can be done with the keyboard shortcuts ctrl
+ shift
+ i
or F12
.
This DevTools menu allows you to do many cool things, such as create new elements, and modify existing ones. In all browsers(that I know of) you can use a little selector at the top-left of the DevTools panel to enable a mode that if you click on an area of the screen, it brings you to the element in question within the DevTools panel.
There's not much else advice I can give you. Just look around the Scratch site to get inspiration, and then either create or edit an element on a page you like to fit your needs.
1title: How to Make Scratch Mockups 2date: 2021 Apr 22 3updated: 2024 Jan 3 4 5The first step to making a mockup is to open the <abbr title="Developer Tools">[DevTools](https://developer.chrome.com/docs/devtools/)</abbr>. This can be done with the keyboard shortcuts `ctrl` + `shift` + `i` or `F12`. 6 7This DevTools menu allows you to do many cool things, such as create new elements, and modify existing ones. In all browsers(that I know of) you can use a little selector at the top-left of the DevTools panel to enable a mode that if you click on an area of the screen, it brings you to the element in question within the DevTools panel. 8 9There's not much else advice I can give you. Just look around the Scratch site to get inspiration, and then either create or edit an element on a page you like to fit your needs. 10