Product hunt banner in the bottom corner after a few seconds

[ArnabChatterjee20k]

Since this product is already on producthunt , we definitely need votes to maintain it. So one cool way will be opening a banner in the bottom left saying something like please upvote it on product hunt

To maintain a proper ux, the banner should after a seconds for one time

[Dhevamuthu]

Please assign the issue for me under GSSOC 2024

[ArnabChatterjee20k]

@Dhevamuthu I am assigning you this issue Update me every 24 hours and deadline 36 hours can you provide a strategy about how you are going to implement it And what will be the ui

[Dhevamuthu]

I need to add a icon in the bottom left corner of your application which shows a banner of "please upvote it on product hunt" for every 1 minute duration

Am I right??

I can implement the banner by the following:

Create the HTML and CSS for the banner to position it in the bottom left corner of the screen. Use JavaScript to handle the timing and storage logic.

[ArnabChatterjee20k]

I need to add a icon in the bottom left corner of your application which shows a banner of "please upvote it on product hunt" for every 1 minute duration

Am I right??

I can implement the banner by the following:

Create the HTML and CSS for the banner to position it in the bottom left corner of the screen. Use JavaScript to handle the timing and storage logic.

No I am telling something like this

And it will appear only once after the page has been opened for atleast 1 min like the geekforgeeks do. And it will open every time. The ui and how the whole thing gonna get present will play a crucial role. Share some strategy how r you gonna make the ui of the banner

I have already written the appearance logic. If you want I can share it

[Dhevamuthu]

Yes.. Can u share me the appearance logic

please answer this question alone..Whether it is enough to create a button, upon clicking it,it just go to any page..I no need to develop that page right?? only the button right?? Then I need to work on frontend only right??

[ArnabChatterjee20k]

You dont have to work on button rather on a banner

[Dhevamuthu]

I can start working if u provide

1.appearance logic- explaining the size,where to appear and other details

2. Supabase key and details for using this project

[ArnabChatterjee20k]

I can start working if u provide

1.appearance logic- explaining the size,where to appear and other details 2. Supabase key and details for using this project

1) Start working on the ui first. Make it working first 2) Create supabase project and add your own key. Read the readme first.

[Dhevamuthu]

To work on UI , I need the details of the banner right? what about the size,location,when I click on the banner,to which page it should go to??

provide the details about it

[ArnabChatterjee20k]

To work on UI , I need the details of the banner right? what about the size,location,when I click on the banner,to which page it should go to??

provide the details about it

I have already given the image In the image its in the bottom right. And since its a product hunt banner then ofcourse to the producthunt page only

[Dhevamuthu]

https://github.com/ArnabChatterjee20k/PickPalette-PaletteFromImage/assets/123234572/02e1ead3-fa82-431e-99b0-ffa7613adcba

I have done using css and by creating a component for banner.. Going to work for making banner to appear below the bottombars... and will update you

[Dhevamuthu]

https://github.com/ArnabChatterjee20k/PickPalette-PaletteFromImage/assets/123234572/85314c87-87a5-4fcb-84e3-aa0566e679cc

whether it is okay?? what alterations I need to do if so @ArnabChatterjee20k

[ArnabChatterjee20k]

banner.mp4 whether it is okay?? what alterations I need to do if so @ArnabChatterjee20k

Change the ui.

[Dhevamuthu]

In what way are u saying..

Can I know it

[ArnabChatterjee20k]

I don't know that's why I created the issue. Its not catchy. The banner will get ignore if people don't see it. The ux should be like the eyes are automatically get dragged in the banner. Its not a coding problem rather a ui/ux solution. Don't focus on css from the first. Try to create some designs first and then iterate

[Dhevamuthu]

banner_altered.zip whether this is okay??

[ArnabChatterjee20k]

@Dhevamuthu ok I am opening the zip but don't share zip files from next time

[ArnabChatterjee20k]

You can directly share videos here or use youtube or gdrive

[ArnabChatterjee20k]

@Dhevamuthu upload the video here directly in this thread

[Dhevamuthu]

Sure.. will do now

[Dhevamuthu]

https://github.com/ArnabChatterjee20k/PickPalette-PaletteFromImage/assets/123234572/2f16cddf-3864-41b0-9765-eb29826a9b4a

Is it okay?

[ArnabChatterjee20k]

Change the color Its looking odd Take your time

[ArnabChatterjee20k]

I have one question, should we change our plan a bit? Instead of showing it in the bottom , what if we open it as a modal in the center of the screen?

[Dhevamuthu]

if we show in the center of the screen, it willbe like a pop up but the banner should be kept at either side of page not at center

Banners in side can be effective for secondary promotions @ArnabChatterjee20k

[ArnabChatterjee20k]

Something like this

[Dhevamuthu]

For cookies it must be at the center

[Dhevamuthu]

Position of banner depends on its usage

Here the utilisation of banner will not be efficient if placed at center

[ArnabChatterjee20k]

Getting it, it will get annoying. Lets iterate upon some design

[Dhevamuthu]

Change the color Its looking odd Take your time

Will update u within today

[ArnabChatterjee20k]

Change the color Its looking odd Take your time

Will update u within today

dont write the code first, try to design the ui or the banner first... otherwise it will create a lot of husstle

[Dhevamuthu]

I searched for contrast colors and had shared some pic can u pick up one if u like it.

[ArnabChatterjee20k]

I searched for contrast colors and had shared some pic can u pick up one if u like it.

Frankly it's not looking good...

[Dhevamuthu]

For black bg, we can't apply banners with light colors only like these colors will look good @ArnabChatterjee20k

I have searched for most of the colors, these are the recommended colors.Only double or multiple colors will be attractive to the user

Only by giving contrast color for the banner, it will be visible to the users in an unique manner

[ArnabChatterjee20k]

what if we build a card like this https://ui.aceternity.com/components/canvas-reveal-effect see here no effect on hover, it will be from the start

[Dhevamuthu]

Can do it @ArnabChatterjee20k At the right bottom only right??...

With small size than this?

[ArnabChatterjee20k]

Yes in the way it was planned but with the ui like this

[Dhevamuthu]

Okay will work and update u soon @ArnabChatterjee20k

[ArnabChatterjee20k]

@Dhevamuthu any updates?

[Dhevamuthu]

Working on it @ArnabChatterjee20k Will update u by tomorrow for sure

[ArnabChatterjee20k]

fine

[Dhevamuthu]

I tried that effect for the banner @ArnabChatterjee20k

but it's not looking so good..As of my search, those effects will be good for the cards with comments and any news like features..

But for banner, it looks odd for that page.Even I tried with different combo colors, it is looking pale and not good looking one and this effect is applied only when mouse hovers.So definitely it wont be a best choice for the banner.

only the multiple colors or dark colors suits well for the banner..

Similarly, I applied the dots for other colors also, it's not looking good as of my choice.So please check through it..

[ArnabChatterjee20k]

I am literally confused now

[Dhevamuthu]

Please don't get confused @ArnabChatterjee20k

My opinion is that effect specified by you doesn't look good for banners..

[ArnabChatterjee20k]

I need to add a icon in the bottom left corner of your application which shows a banner of "please upvote it on product hunt" for every 1 minute duration Am I right?? I can implement the banner by the following: Create the HTML and CSS for the banner to position it in the bottom left corner of the screen. Use JavaScript to handle the timing and storage logic.

No I am telling something like this

And it will appear only once after the page has been opened for atleast 1 min like the geekforgeeks do. And it will open every time. The ui and how the whole thing gonna get present will play a crucial role. Share some strategy how r you gonna make the ui of the banner

I have already written the appearance logic. If you want I can share it

then I think for a safe side lets move with this only

[Dhevamuthu]

I searched for contrast colors and had shared some pic can u pick up one if u like it.

what like this with yellow shade color with ui effects

[ArnabChatterjee20k]

They are not looking good.

[Dhevamuthu]

Will try for other designs and will update u

[Dhevamuthu]

According to my opinion and searches, the shades of colors looks good and it makes the page looks fine and attractive to users.

if this is okay, then please say me so that I can proceed with it. Else say me if you have any color combinations to other styles of ui

If it's not okay, I'm really sorry @ArnabChatterjee20k , I can't do further here.

[ArnabChatterjee20k]

I need to add a icon in the bottom left corner of your application which shows a banner of "please upvote it on product hunt" for every 1 minute duration Am I right?? I can implement the banner by the following: Create the HTML and CSS for the banner to position it in the bottom left corner of the screen. Use JavaScript to handle the timing and storage logic.

No I am telling something like this

And it will appear only once after the page has been opened for atleast 1 min like the geekforgeeks do. And it will open every time. The ui and how the whole thing gonna get present will play a crucial role. Share some strategy how r you gonna make the ui of the banner

I have already written the appearance logic. If you want I can share it

go with this design only

[Dhevamuthu]

https://github.com/ArnabChatterjee20k/PickPalette-PaletteFromImage/assets/123234572/b5718e2a-99e5-4209-85f6-67ced4df9255

I have completed it.