# P5js project as a png?

**URL:** <https://discourse.processing.org/t/p5js-project-as-a-png/26519>\
**Category:** p5.js\
**Created:** [December 26, 2020, 11:40am UTC](https://discourse.processing.org/t/p5js-project-as-a-png/26519 "2020-12-26T11:40:09Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![olaf000olaf](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/olaf000olaf/32/11295_2.png) [@olaf000olaf](https://discourse.processing.org/u/olaf000olaf)\
**Post date:** [December 26, 2020, 11:40am UTC](https://discourse.processing.org/t/p5js-project-as-a-png/26519/1 "2020-12-26T11:40:09Z")

</div>

I made this sketch [https://www.openprocessing.org/sketch/1049735](https://www.openprocessing.org/sketch/1049735) and I want to put it as my iPhone’s wallpaper. If I screenshot it will look very bad on my phone, Is there a way I can download the canvas as a png?

btw there is a lot of random code on there, it’s not important.

---

<div class="post-metadata">

**Author:** ![CodeMasterX](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/codemasterx/32/2942_2.png) [@CodeMasterX](https://discourse.processing.org/u/CodeMasterX)\
**Post date:** [December 26, 2020, 11:44am UTC](https://discourse.processing.org/t/p5js-project-as-a-png/26519/2 "2020-12-26T11:44:42Z")

</div>

> [@olaf000olaf](#):
>
> made this sketch [My Sketch - OpenProcessing](https://www.openprocessing.org/sketch/1049735) and I want to put it as my iPhone’s wallpaper. If I screenshot it will look very bad on my phone, Is there a way I can d

you can right click and use "save image as"

 ![randomImg](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/4/4d6fdc919f8deabad2fc25d821708bfcbf8d5743.png) (the image I got)  
now just crop it to fit and voila

---

<div class="post-metadata">

**Author:** ![olaf000olaf](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/olaf000olaf/32/11295_2.png) [@olaf000olaf](https://discourse.processing.org/u/olaf000olaf)\
**Post date:** [December 26, 2020, 12:01pm UTC](https://discourse.processing.org/t/p5js-project-as-a-png/26519/3 "2020-12-26T12:01:16Z")

</div>

oh, thx again. Is there a way I can also save it as a video for the lock screen?

---

<div class="post-metadata">

**Author:** ![CodeMasterX](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/codemasterx/32/2942_2.png) [@CodeMasterX](https://discourse.processing.org/u/CodeMasterX)\
**Post date:** [December 26, 2020, 12:08pm UTC](https://discourse.processing.org/t/p5js-project-as-a-png/26519/4 "2020-12-26T12:08:55Z")

</div>

The way I create animations is by constantly saving the screen and compiling it in the “movie maker” tool in processing which returns .mte file (something like this) and then I use openShot video editor to change it to .mp4 file.

---

<div class="post-metadata">

**Author:** ![olaf000olaf](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/olaf000olaf/32/11295_2.png) [@olaf000olaf](https://discourse.processing.org/u/olaf000olaf)\
**Post date:** [December 26, 2020, 12:11pm UTC](https://discourse.processing.org/t/p5js-project-as-a-png/26519/5 "2020-12-26T12:11:26Z")

</div>

Ok thx. I’ll look into it.

---

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [December 26, 2020, 2:28pm UTC](https://discourse.processing.org/t/p5js-project-as-a-png/26519/6 "2020-12-26T14:28:47Z")

</div>

Hello @olaf000olaf,

I added this to end of your code:

```auto
function keyTyped() {
  if (key === 's') {
    save('heart.png');
  }
}

```

Reference:  
_[https://p5js.org/reference/#/p5.Image/save](https://p5js.org/reference/#/p5.Image/save)_

It saved the image to the download folder:

 ![heart (6)](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/3/38290bd1b9a701b0e7276e83c87ab2a523ab6e10.png)

`:)`