# Holiday Card Maker on Fruit Jam
## Overview
This Fruit Jam app lets you design printable greeting cards. The text and image on the front of the card, as well as the text inside the card are all customizable.
https://www.youtube.com/shorts/jFm4CE0n9hY
If your card is in celebration of one of the winter holidays, you can use the include snowflake designer to make a geometric snowflake for the front of your card. If snowflakes not your style? No problem, the image on the front can be a custom SVG or PNG image file instead. It can also easily adapt to cards for any occasion by omitting or changing the emoji that appear on the front of the card.
Once all of the text and image details are set, the card is generated and put on the **CPSAVES** drive, where it can be accessed by your PC. Open the card HTML file in a browser and it's ready to print, fold up, and then give to a friend or family member.
## Parts
Featured
### Adafruit Fruit Jam - Mini RP2350 Computer
[Adafruit Fruit Jam - Mini RP2350 Computer](https://www.adafruit.com/product/6200)
We were catching up on a recent [hackaday hackchat with eben upton](https://hackaday.io/event/202122-raspberry-pi-hack-chat-with-eben-upton) and learned some fun facts: such as the DVI hack for the RP2040 was inspired by
In Stock
[Buy Now](https://www.adafruit.com/product/6200)
[Related Guides to the Product](https://learn.adafruit.com/products/6200/guides)
Featured
### HDMI Cable - 1 meter
[HDMI Cable - 1 meter](https://www.adafruit.com/product/608)
Connect two HDMI devices together with this basic HDMI cable. It has nice molded grips for easy installation, and is 1 meter long (about 3 feet). This is a HDMI 1.3 cable.
We're now stocking a very fancy Official Raspberry Pi cable with overmolding and a Pi logo. Please note...
In Stock
[Buy Now](https://www.adafruit.com/product/608)
[Related Guides to the Product](https://learn.adafruit.com/products/608/guides)
Featured
### USB Type A to Type C Cable - approx 1 meter / 3 ft long
[USB Type A to Type C Cable - approx 1 meter / 3 ft long](https://www.adafruit.com/product/4474)
As technology changes and adapts, so does Adafruit. This **USB Type A to Type C** cable will help you with the transition to USB C, even if you're still totin' around a USB Type A hub, computer or laptop.
USB C is the latest industry-standard connector for...
In Stock
[Buy Now](https://www.adafruit.com/product/4474)
[Related Guides to the Product](https://learn.adafruit.com/products/4474/guides)
Featured
### Snap-on Enclosure for Adafruit Fruit Jam
[Snap-on Enclosure for Adafruit Fruit Jam](https://www.adafruit.com/product/6425)
Here is a cool and minimal enclosure for your [Fruit Jam](https://www.adafruit.com/product/6200) to keep it safe during use and transport. This case has been custom-designed and 3D printed to accommodate all connection ports of the Fruit Jam. No screws or...
In Stock
[Buy Now](https://www.adafruit.com/product/6425)
[Related Guides to the Product](https://learn.adafruit.com/products/6425/guides)
Featured
### USB Wired Mouse - Two Buttons plus Wheel
[USB Wired Mouse - Two Buttons plus Wheel](https://www.adafruit.com/product/2025)
This is a mouse. A nice, simple mouse. No bells or whistles. Just a mouse.
But that doesn't mean it's not the best simple mouse! We compared a few and liked this one quite a bit. It's optical for good resolution and precision, has two...
In Stock
[Buy Now](https://www.adafruit.com/product/2025)
[Related Guides to the Product](https://learn.adafruit.com/products/2025/guides)
Featured
### Mini Chiclet Keyboard - USB Wired - Black
[Mini Chiclet Keyboard - USB Wired - Black](https://www.adafruit.com/product/1736)
Add a good quality, slim keyboard to your Raspberry Pi, Beagle Bone Black, or other single-board-computer with this sleek black chiclet keyboard. It's a full QWERTY keyboard with a USB cable and is compatible with all operating systems. We tried many keyboards to find one that felt...
In Stock
[Buy Now](https://www.adafruit.com/product/1736)
[Related Guides to the Product](https://learn.adafruit.com/products/1736/guides)
Featured
### 7" Display 1280x800 (720p) IPS + Speakers - HDMI/VGA/NTSC/PAL
[7" Display 1280x800 (720p) IPS + Speakers - HDMI/VGA/NTSC/PAL](https://www.adafruit.com/product/1667)
Yes, this is an adorable small HDMI television with incredibly high resolution **and built in 3W stereo speakers**! We tried to get the smallest possible HDMI/VGA display with high-res, high-contrast visibility. The visible display measures only 7" (17.8cm) diagonal, and the TFT comes...
In Stock
[Buy Now](https://www.adafruit.com/product/1667)
[Related Guides to the Product](https://learn.adafruit.com/products/1667/guides)
# Holiday Card Maker on Fruit Jam
## Install CircuitPython
[CircuitPython](https://github.com/adafruit/circuitpython) is a derivative of [MicroPython](https://micropython.org) designed to simplify experimentation and education on low-cost microcontrollers. It makes it easier than ever to get prototyping by requiring no upfront desktop software downloads. Simply copy and edit files on the **CIRCUITPY** drive to iterate.
## CircuitPython Quickstart
Follow this step-by-step to quickly get CircuitPython running on your board.
Warning: Please use the latest release of 10.x or higher for the Fruit Jam. Also use the latest libraries for the best functionality.
[Download the latest version of CircuitPython for this board via circuitpython.org](https://circuitpython.org/board/adafruit_fruit_jam/)
**Click the link above to download the latest CircuitPython UF2 file.**
Save it wherever is convenient for you.
To enter the bootloader, hold down the **BOOT/**** BOOTSEL button**(highlighted in red above), and while continuing to hold it (don't let go!), press and release the**reset button**(highlighted in red or blue above). **Continue to hold the BOOT/BOOTSEL button until the RP2350 drive appears!**
If the drive does not appear, release all the buttons, and then repeat the process above.
You can also start with your board unplugged from USB, press and hold the BOOTSEL button (highlighted in red above), continue to hold it while plugging it into USB, and wait for the drive to appear before releasing the button.
A lot of people end up using charge-only USB cables and it is very frustrating! **Make sure you have a USB cable you know is good for data sync.**
You will see a new disk drive appear called **RP2350**.
Drag the **adafruit-circuitpython-_boardname_-_language_-_version_.uf2** file to **RP2350.**
The **RP2350** drive will disappear and a new disk drive called **CIRCUITPY** will appear.
That's it, you're done! :)
## Safe Mode
You want to edit your **code.py** or modify the files on your **CIRCUITPY** drive, but find that you can't. Perhaps your board has gotten into a state where **CIRCUITPY** is read-only. You may have turned off the **CIRCUITPY** drive altogether. Whatever the reason, safe mode can help.
Safe mode in CircuitPython does not run any user code on startup, and disables auto-reload. This means a few things. First, safe mode _bypasses any code in_ **boot.py** (where you can set **CIRCUITPY** read-only or turn it off completely). Second, _it does not run the code in_ **code.py**. And finally, _it does not automatically soft-reload when data is written to the_ **CIRCUITPY** _drive_.
Therefore, whatever you may have done to put your board in a non-interactive state, safe mode gives you the opportunity to correct it without losing all of the data on the **CIRCUITPY** drive.
### Entering Safe Mode
To enter safe mode when using CircuitPython, plug in your board or hit reset (highlighted in red above). Immediately after the board starts up or resets, it waits 1000ms. On some boards, the onboard status LED (highlighted in green above) will blink yellow during that time. If you press reset during that 1000ms, the board will start up in safe mode. It can be difficult to react to the yellow LED, so you may want to think of it simply as a slow double click of the reset button. (Remember, a fast double click of reset enters the bootloader.)
### In Safe Mode
If you successfully enter safe mode on CircuitPython, the LED will intermittently blink yellow three times.
If you connect to the serial console, you'll find the following message.
```terminal
Auto-reload is off.
Running in safe mode! Not running saved code.
CircuitPython is in safe mode because you pressed the reset button during boot. Press again to exit safe mode.
Press any key to enter the REPL. Use CTRL-D to reload.
```
You can now edit the contents of the **CIRCUITPY** drive. Remember, _your code will not run until you press the reset button, or unplug and plug in your board, to get out of safe mode._
## Flash Resetting UF2
If your board ever gets into a really _weird_ state and CIRCUITPY doesn't show up as a disk drive after installing CircuitPython, try loading this 'nuke' UF2 to RP2350. which will do a 'deep clean' on your Flash Memory. **You will lose all the files on the board** , but at least you'll be able to revive it! After loading this UF2, follow the steps above to re-install CircuitPython.
[Download flash erasing "nuke" UF2 for RP2350](https://cdn-learn.adafruit.com/assets/assets/000/132/526/original/rp2350_flash_nuke.uf2)
# Holiday Card Maker on Fruit Jam
## Code
## Getting the Program's Files
To use the application, you need to obtain **code.py** with the program, and the other project files to place on the Fruit Jam **CIRCUITPY** drive.
Thankfully, this can be done in one go. In the example below, click the **Download Project Bundle** button below to download the necessary libraries, the **code.py** file, and other project files in a zip file.
Connect your board to your computer via a known good data+power USB cable. The board should show up in your File Explorer/Finder (depending on your operating system) as a flash drive named **CIRCUITPY**.
Extract the contents of the zip file, copy the **lib** directory files to **CIRCUITPY/lib**. Copy the **code.py** , **card\_maker\_helpers.py** , **card.template.html** , **snowflake.template.svg** , and **checkbox.bmp** files to your **CIRCUITPY** drive. The program should self start.
https://github.com/adafruit/Adafruit_Learning_System_Guides/blob/main/Fruit_Jam/Fruit_Jam_Card_Maker/project_code/code.py
## Drive Structure
After copying the files, your drive should look like the listing below. It can contain other files as well, but must contain these at a minimum.
# Holiday Card Maker on Fruit Jam
## Code Explanation
The code for this project consists of two python files **code.py** and **card\_maker\_helpers.py** , as well as two template files **card.template.html** and **snowflake.template.svg**.
## **card\_maker\_helpers.py**
This file contains several helper functions as well as a class which are all imported and used by the **code.py** file. Helper functions:
- `svg_points()` Converts points from a `list` of `tuples` into a string that is in SVG polygon comma separated syntax.
- `distance()` A simple distance calculation to determine how far apart two points are.
- `random_polygon()` Generates and returns the points for a random polygon. Special care is taken inside this function to not generate any line segments that intersect with existing segments chosen for the random polygon. This ensures the shape doesn't cross back over itself.
- `fill_polygon()` Draws and fills in the given polygon in the provided `Bitmap` using the specified color.
- `draw_snowflake()` Draws all of the polygons that make up a snowflake in the provided `Bitmap`.
There is also a class `PointHighlighterCache` which provides a pool of small crosshair images to be placed in the snowflake maker screen at the points where the user clicks the mouse.
This class ensures that only as many highlighters as are needed get created. It re-uses any existing ones before creating new ones.
The first point gets colored green and the rest are black. Once the first point is clicked again it will close the shape and draw the polygon.
## Template Files
The two template files are meant to be used with the [adafruit\_templateengine](https://github.com/adafruit/Adafruit_CircuitPython_TemplateEngine) library. The library allows code to fill in specified parts of the templates using data that was generated dynamically, in our case by the user drawing their snowflake, and entering the card messages and other options.
**snowflake.template.svg** is an SVG image file. SVG files are actually just plain text XML files that contain geometry data about what shapes to draw. This template contains a for loop that draws 4 copies of each polygon from a list. The main copy in the top left is drawn in its normal orientation, the other copies are mirrored vertically and/or horizontally to create the snowflake patterns. CircuitPython doesn't support viewing SVG files directly, but web browsers do.
**card.template.html** is an HTML web page greeting card template. The page uses CSS to be laid out in 4 quadrants that add up to the size a plain sheet of paper. Two quadrants are mirrored vertically to account for the folds that will be made to the card after printing. The front image file, front message, and inside message all get filled in with values that are entered or selected on the card setup page.
## **code.py**
The main project code file is responsible for the high level functionality and behavior of the app. It sets up all of the visual elements, adding them into two separate `Group`s. One `Group` for the card setup screen, and another for the snowflake maker screen. A [PageLayout](https://github.com/adafruit/Adafruit_CircuitPython_DisplayIO_Layout/blob/main/adafruit_displayio_layout/layouts/page_layout.py) is used to easily change between the different screens.
### Card Setup Screen
In the main loop, the code checks the keyboard and mouse for input events and reacts to them according to which screen is showing and whether any of the input boxes have focus. CheckBoxes are toggled when they get clicked. Input boxes will get focus when clicked, and will add typed characters to the end of their input if they have focus.
When the generate button is clicked, the following tasks occur to prepare the card file:
- Validation to ensure a front image has been selected.
- If the user opted to use a snowflake image for the front, the **snowflake.svg** file is rendered from the polygons drawn in the snowflake maker screen. The file gets written to the **CPSAVES** drive.
- If one of the custom image files is selected, that file gets copied from **CIRCUITPY** to **CPSAVES**.
- If the front emoji checkbox is checked the front message is appended together with the emoji characters.
- The card HTML template is rendered using data entered by the user. The **card.html** file gets written to the **CPSAVES** drive.
- All of the card details are also stored as JSON in the file **card\_data.json** in **CPSAVES**. When the app launches it will check for this file and try to load the data from it to let the user resume from the last card they made.
The last button is for remounting the **CPSAVES** drive to the computer. This is used after the card has been generated to refresh the files visible to the PC. **CPSAVES** uses the FAT filesystem which does not contain support for notifying the host of changes to files, so this manual unmount/eject and then remount process ensures that the PC can see the latest version of the generated files.
### Snowflake Maker Screen
When the snowflake maker screen is showing, the mouse will be restricted to the top left corner of the snowflake. Clicking the mouse will drop a point highlight at the location clicked. After clicking a few more points and then clicking back on the first point again, the polygon will be closed and then drawn and filled in. The polygon shapes automatically get duplicated and mirrored using 3 more `TileGrid`s with their `flip_x` and `flip_y` properties to handle the mirroring.
A `Label` on the right acts as an info pane showing a few keyboard keys shortcuts and basic instructions for drawing a snowflake.
# Holiday Card Maker on Fruit Jam
## Use
### Connect Hardware
Plug in a USB keyboard and mouse to the two USB host ports on the Fruit Jam. Use an HDMI cable to connect to a DVI compatible display. Connect a USB C cable in to the Fruit Jam for power.
### Set Up Card
Click the input boxes and type in a short message for the front of the card, and a longer one for the inside of the card. Check the "Include Emoji" CheckBox if you want the front of the card to include some festive emoji characters. Check one of the boxes on the bottom left to choose whether to use a snowflake, custom SVG, or custom PNG file for the front image.
To use a custom image save the image, copy the file to **CIRCUITPY** using the name " **custom\_front.svg**" or " **custom\_front.png**". The name of the file must match one of these exactly, and the file must be directly in the root of the **CIRCUITPY** drive.
### Snowflake Designer
If you're using a snowflake image for the front and want a color other than the default blue, type in a custom color to the snowflake color input box. In the image to the left, the custom pink color of `0xee88ff` has been typed into the color input. Click the "Make Snowflake" button to open up the snowflake designer.
Inside the snowflake designer, click points in the upper left corner of the snowflake to make polygon shapes to cut out of the white background. The snowflake designer screen also supports a few keyboard hotkeys.
- Del - Press the **delete key** to erase the current snowflake and start over with a blank white canvas.
- r - The **r key** will add a random polygon shape cutout to the canvas. You can press it multiple times to build up more cutouts until you are satisfied with the look of the snowflake.
- Ctrl+z - The **Ctrl+z** combo has the typical undo behavior. It will remove the most recently added shape from the snowflake whether it was added randomly or manually. Use this if you make a mistake or don't like the looks of a randomly generated shape.
- Esc - Once you like the snowflake and are ready to get it printed on a card, press the **Esc** key to exit the snowflake designer and go back to the card setup screen.
## Generate & Print Card
Once everything is all set, press the "Generate Card" button. A status message will appear above the button indicating progress and showing a "Card Saved" message when the process is complete. Typically it takes only a few seconds, but can go longer for large custom image files.
If your Fruit Jam is not plugged into a PC with the USB cable, then now is the time to un-plug the USB C cable and plug in the Fruit Jam to your PC instead of a power adapter or other power source. When you connect the Fruit Jam to a PC, it should mount both the **CIRCUITPY** and **CPSAVES** drive on your computer. The generated card is stored as **card.html** on the **CPSAVES** drive.
If your Fruit Jam has been plugged into the PC the whole time, you need to do one more step to manually unmount/remount **CPSAVES** to get the PC to see the card file that was just generated. On your computer, unmount or eject the **CPSAVES** drive using the standard procedure for your OS. Then back inside of the app click on the "Remount CPSAVES" button. After a few seconds the **CPSAVES** drive will reappear on the PC and contain the latest version of the card file.
Find the **card.html** file inside of CPSAVES and open it inside of a web browser.
In the browser, open the menu and click **Print**.
In the print settings, ensure that the page is set to the portrait orientation, and set the following settings:
- Enable "Fit to page width"
- Set the margins to "None" or the smallest option available.
- Disable "Print headers and footers"
Take a last look at the preview on the left and make sure it looks good. If it doesn't, now is the time to go back and change anything that needs it.
When it's looking good, click the Print button.
Once the card is printed, fold it in half on the short side or "hamburger style", then fold the result in half again to make the greeting card with the image on the front and the longer message on the inside.
## Guide Products
### Adafruit Fruit Jam - Mini RP2350 Computer
[Adafruit Fruit Jam - Mini RP2350 Computer](https://www.adafruit.com/product/6200)
We were catching up on a recent [hackaday hackchat with eben upton](https://hackaday.io/event/202122-raspberry-pi-hack-chat-with-eben-upton) and learned some fun facts: such as the DVI hack for the RP2040 was inspired by
In Stock
[Buy Now](https://www.adafruit.com/product/6200)
[Related Guides to the Product](https://learn.adafruit.com/products/6200/guides)
### HDMI Cable - 1 meter
[HDMI Cable - 1 meter](https://www.adafruit.com/product/608)
Connect two HDMI devices together with this basic HDMI cable. It has nice molded grips for easy installation, and is 1 meter long (about 3 feet). This is a HDMI 1.3 cable.
We're now stocking a very fancy Official Raspberry Pi cable with overmolding and a Pi logo. Please note...
In Stock
[Buy Now](https://www.adafruit.com/product/608)
[Related Guides to the Product](https://learn.adafruit.com/products/608/guides)
### USB Type A to Type C Cable - approx 1 meter / 3 ft long
[USB Type A to Type C Cable - approx 1 meter / 3 ft long](https://www.adafruit.com/product/4474)
As technology changes and adapts, so does Adafruit. This **USB Type A to Type C** cable will help you with the transition to USB C, even if you're still totin' around a USB Type A hub, computer or laptop.
USB C is the latest industry-standard connector for...
In Stock
[Buy Now](https://www.adafruit.com/product/4474)
[Related Guides to the Product](https://learn.adafruit.com/products/4474/guides)
### Snap-on Enclosure for Adafruit Fruit Jam
[Snap-on Enclosure for Adafruit Fruit Jam](https://www.adafruit.com/product/6425)
Here is a cool and minimal enclosure for your [Fruit Jam](https://www.adafruit.com/product/6200) to keep it safe during use and transport. This case has been custom-designed and 3D printed to accommodate all connection ports of the Fruit Jam. No screws or...
In Stock
[Buy Now](https://www.adafruit.com/product/6425)
[Related Guides to the Product](https://learn.adafruit.com/products/6425/guides)
### USB Wired Mouse - Two Buttons plus Wheel
[USB Wired Mouse - Two Buttons plus Wheel](https://www.adafruit.com/product/2025)
This is a mouse. A nice, simple mouse. No bells or whistles. Just a mouse.
But that doesn't mean it's not the best simple mouse! We compared a few and liked this one quite a bit. It's optical for good resolution and precision, has two...
In Stock
[Buy Now](https://www.adafruit.com/product/2025)
[Related Guides to the Product](https://learn.adafruit.com/products/2025/guides)
### Mini Chiclet Keyboard - USB Wired - Black
[Mini Chiclet Keyboard - USB Wired - Black](https://www.adafruit.com/product/1736)
Add a good quality, slim keyboard to your Raspberry Pi, Beagle Bone Black, or other single-board-computer with this sleek black chiclet keyboard. It's a full QWERTY keyboard with a USB cable and is compatible with all operating systems. We tried many keyboards to find one that felt...
In Stock
[Buy Now](https://www.adafruit.com/product/1736)
[Related Guides to the Product](https://learn.adafruit.com/products/1736/guides)
### 7" Display 1280x800 (720p) IPS + Speakers - HDMI/VGA/NTSC/PAL
[7" Display 1280x800 (720p) IPS + Speakers - HDMI/VGA/NTSC/PAL](https://www.adafruit.com/product/1667)
Yes, this is an adorable small HDMI television with incredibly high resolution **and built in 3W stereo speakers**! We tried to get the smallest possible HDMI/VGA display with high-res, high-contrast visibility. The visible display measures only 7" (17.8cm) diagonal, and the TFT comes...
In Stock
[Buy Now](https://www.adafruit.com/product/1667)
[Related Guides to the Product](https://learn.adafruit.com/products/1667/guides)
## Related Guides
- [Using a Mouse with USB Host](https://learn.adafruit.com/using-a-mouse-with-usb-host.md)
- [Using a Keyboard with USB Host](https://learn.adafruit.com/using-a-keyboard-with-usb-host.md)
- [Adafruit Fruit Jam](https://learn.adafruit.com/adafruit-fruit-jam.md)
- [50 Cent CPI Tracker for MagTag](https://learn.adafruit.com/50-cent-cpi-tracker-for-magtag.md)
- [RP2040 RunCPM Emulator with USB Keyboard & HDMI screen](https://learn.adafruit.com/rp2040-runcpm-emulator-with-usb-keyboard-hdmi-screen.md)
- [Feather RP2040 DVI CircuitPython Day 2024 Countdown Clock](https://learn.adafruit.com/feather-rp2040-dvi-circuitpython-day-2024-countdown-clock.md)
- [ESPectre Human Detector for Feather](https://learn.adafruit.com/espectre-human-detector-for-feather.md)
- [Return to The Matrix with the Metro RP2350 or Fruit Jam](https://learn.adafruit.com/return-to-the-matrix-with-the-metro-rp2350.md)
- [Set up Web Workflow on the Adafruit MEMENTO](https://learn.adafruit.com/set-up-web-workflow-on-the-adafruit-memento.md)
- [Scrambled Number Security Keypad](https://learn.adafruit.com/scrambled-number-security-keypad.md)
- [MEMENTO Camera Quick Start Guide](https://learn.adafruit.com/memento-camera-quick-start-guide.md)
- [Capturing Camera Images with CircuitPython](https://learn.adafruit.com/capturing-camera-images-with-circuitpython.md)
- [MEMENTO Focus Stacking](https://learn.adafruit.com/memento-focus-stacking.md)
- [Raspberry Pi Video Looper 2](https://learn.adafruit.com/raspberry-pi-video-looper-2.md)
- [PICO-8 Fruit Jam Reality Console](https://learn.adafruit.com/pico-8-fruit-jam-reality-console.md)
- [iBook iPad Case](https://learn.adafruit.com/ibook-ipad-case.md)
- [QT Py S2 Round Display Compass](https://learn.adafruit.com/qt-py-s2-round-display-compass.md)
- [PyPortal Titano Weather Station](https://learn.adafruit.com/pyportal-titano-weather-station.md)