A mirror of my website's source code.

By using this site, you agree to have cookies stored on your device, strictly for functional purposes, such as storing your session and preferences.

Dismiss

 How-To-make-mockups.md

View raw Download
text/plain • 814 B
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.

                
                    
1
title: How to Make Scratch Mockups
2
date: 2021 Apr 22
3
updated: 2024 Jan 3
4
5
The 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
7
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.
8
9
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.
10