rishimohan/pika

Quickly design beautiful screenshots and open graph images

Hi, I'm Rishi. I'm into front-end, design, building SaaS and open-source.

Stack of choice: Next.js, TailwindCSS, Radix UI, Supabase, Node

Building:

• Pika, screenshot editor and API for image generation

Built:

• Kizie, twitter client for web
• Maazi, journal app with text and audio entries, iOS App
• Codezen, app to generate image from code
• Qurb, mockup generator

Personal links:

• Website
• Twitter

pika's Issues

Project doesnt have a good read me

The project doesn't have a good read me and would require one for people to understand what the project is about and hence contribute to it. So I propose to create a good readme.

First time copy to clip board functionality seems like broken.

Tested in both Safari and Chrome browsers.

Before Fix:

Untitled.mp4

After Fix:

Screen.Recording.2022-01-05.at.11.19.43.PM.mov

Solution: I tried below solution

Resizable inner window viewport

Similar to https://carbon.now.sh

Feature Request: Highlight a feature on mockup

Purpose:

To be able to highlight a certain feature/button on the mockup

HOW:

Highlighting could be done by:

1. Maginifying effect
2. Pop-out effect

Losing rounded corners after exporting images.

I downloaded the png file after editing the image on macOS Monterey and Chrome, but the exported file does not contain rounded corners.

Copy and paste does not work on firefox

Impossible to recover the image with a ctrl + c

More granular padding controls

Currently, the options for padding seem a bit limited to me. We can have more granular control, maybe a slider or maybe even an input to set an exact numeric value.

P.S. Willing to work on the issue. You can assign it to me if the idea seems fine.

Ability to copy the final image using Cmd/Ctrl+C

Button border radius doesnt match shadow border radius?

See image.

I'm on Linux running Chrome Version 98.0.4758.80 (Official Build) (64-bit)

Typo error in color.

Detected by CSpell VS code extension 😅

Ability to completely remove the rounded corners not only from the screenshot, but also from the image

Example:

In Telegram (and other messengers) the rounded corners are't visible in full-screen mode. In classic mode all is okay:

Default save filename overwrites previously saved file

The default filename is always "pika-1", so if you're creating multiple screenshots you need to change the filename each time so it doesn't overwrite. An easy fix is adding a timestamp to the filename so each save is unique.

Watermark can be removed

The watermark can be removed/bypassed by simply removing the code of it with inspect element. In order to prevent this, the watermark should be checked and added when exporting the image.

🧩Improvement(Accessibility): Create option to toggle chat widget display

Description

The Intercom widget might be not necessary in some cases and I think it would be great to give the user this control

Business rule

This feature should probably be only available for pro users (?)