Emoji Scene Maker

Emoji Scene Maker is a fun, interactive web application that allows users to create and share scenes composed of emojis and speech bubbles. This project was created by Andrew Wooldridge (triptych@gmail.com).

Features

1. Emoji Selection and Placement

   • Choose from a wide variety of emojis
   • Add emojis to the scene
   • Drag and drop emojis to position them

2. Speech Bubbles

   • Add customizable speech bubbles to your scene
   • Drag and drop speech bubbles to position them

3. Emoji Size Adjustment

   • Increase or decrease the size of selected emojis
   • Use '+' and '-' buttons or keyboard shortcuts

4. Background Customization

   • Set a solid background color
   • Create custom gradient backgrounds

5. Canvas Size Options

   • Choose from preset canvas sizes
   • Adjust the size of your scene

6. Saving and Loading

   • Save your scenes locally
   • Load previously saved scenes

7. Sharing

   • Generate a shareable URL for your scene
   • Export your scene as a PNG image

8. Whimsical Design

   • Playful user interface
   • Skewed emoji background for added fun

9. Credits Section

   • View information about the creator and libraries used

How to Use

1. Adding Emojis

   • Click the "Choose Emoji" button to select an emoji
   • Click "Add Emoji" to add the selected emoji to your scene
   • Drag the emoji to position it

2. Adding Speech Bubbles

   • Enter text in the input field
   • Click "Add Speech Bubble" to add it to your scene
   • Drag the speech bubble to position it

3. Adjusting Emoji Size

   • Click on an emoji to select it
   • Use the '+' and '-' buttons or keyboard shortcuts to adjust size

4. Changing Background

   • Use the color picker to set a solid background color
   • Click "Set Gradient Background" for more options

5. Changing Canvas Size

   • Select a size from the "Canvas Size" dropdown

6. Saving and Loading

   • Click "Save Scene" to save your current scene
   • Click "Load Scene" to view and load saved scenes

7. Sharing

   • Click "Share Scene" to generate a shareable URL
   • Click "Export to PNG" to download your scene as an image

8. Viewing Credits

   • Click the "Credits" button in the upper right corner

Technical Details

This project uses the following technologies and libraries:

• HTML5
• CSS3
• JavaScript (ES6+)
• Emoji Button for emoji selection
• html2canvas for PNG export

Setup

1. Clone this repository or download the source files.
2. Open the index.html file in a modern web browser.

Note: For the best experience, use this application on a desktop or laptop computer with a recent version of Chrome, Firefox, or Safari.

Contributing

This project is currently maintained by Andrew Wooldridge. If you'd like to contribute or report issues, please contact triptych@gmail.com.

License

[Include appropriate license information here]

Enjoy creating fun emoji scenes!