.png)
not been doing much lately because exams are going on currently, but this is what i did today, i am trying to create a card flip effect.
0
Log in to leave a comment
Activity
Shipped this project!
Made a 404 Page as an addition! and also improved a lot of stuff and bugs in the first ship! Check out the latest addition (404 Page) at: https://codedbymohit.xyz/404
Made this button! but i still havent finalized it yet and i dont even if this is gonna count as an “Effect” because thats a component, and the main idea of this project to do 50 experiments on creating multiple effects. but this is a button still lmk what yall think!
0
Log in to leave a comment
8th Effect: Doneee! It is finally ready! See the video (those cards are empty because i didn’t knew what to put inside those :(
Now gonna work on the 9th Effect yayyyy!
0
Log in to leave a comment
8th Effect in progress…. : This will be a simple cards overlapping scroll effect, see the video! It’s almost ready just need to do some finishing touches and optimizations
0
Log in to leave a comment
7th Effect!!!!!!!!!!! (2 effects in a day!): In this effect, the concept is very simple yet entertaining, in this wherever you click an image pops up and then goes away, really nice for a playful site!
2
Log in to leave a comment
Comments
cool! ^^
@Kajmix Thank you!
6th Effect: This one is a techy loader! For all my linux fans out there!
0
Log in to leave a comment
Effect completed! and also created a repository for the playground, main repository will be added after i complete creating all 50 experiments!
0
Log in to leave a comment
Another effect in progress! gonna finish it tommorow!
0
Log in to leave a comment
Another Effect in! For this experiment, i upgraded the image trail effect i made before (https://bylunar.dev/app/cursor-draw) by adding these things:
-
Inertia & Velocity to each card: adding this was important to make this effect look like you are throwing the images, before it was just spawning hte images based on user’s cursor position but now it also throws it into a that direction with a velocity also!
-
Instead of jsut normal scale up and scale down animation, i added a clip path animation that looks way better!
*Images used are from cosmos.so
0
Log in to leave a comment
I finished creating a 404 page as well!
0
Log in to leave a comment
wasted a hell lot of time :heavysob: i tried adding SSG into this existing application to improve SEO but i failed horribly, because the code i wrote is not suitiable for SSR or SSG because i have used window multiple times in the code and in order to now make this code ssr or ssg friendly ill have to guard almost half of my code heavily which is not feasible. i guess ill have to learn next js now. LESSON = Always use Next js if you need SEO.
0
Log in to leave a comment
made the form close when the user clicks outside of the form, and made the content outside the form dim when the form is open, also removed the stagger on the text hover aimation as i didn’t like that much.
1
Log in to leave a comment
Comments
OH NOO I SELECTED THIS GIF ACCEDENTALLY AND NOW CANNOT DELTE IT :heavysob:
Two effects are already created for this project 48 more experiments to go!
1
Log in to leave a comment
Comments
cool effects! keep it up!
made the AI talk a bit like human, and also made it remember the whole chat + made the AI talk first and not just respond to the user messages
0
Log in to leave a comment
I DID A LOT OF THING OFFLINE!! BUT NOW FINALLY CREATED THE PROJECT YAYY!
So heres what i have done so far:
- made a simple mobile phone
- The time works according to the user’s local timezone
- Message system is done, AI is intregated, and is fully working!
Now i will be starting on the ACTUAL tasks that are needed to make this game fun!
- i am using hackclub AI for the ai
0
Log in to leave a comment
Shipped this project!
Finally sooo glad to say that my project is finally ready to be shipped! I learned to work on micro animations and scroll triggered animations, Lets see how many cookies i get!
Site is done! I am just gonna spend one last day tommorow on this to polish everything!
2
Log in to leave a comment
Comments
nice site mate
@Keshav Thank you so much!
I forgot to post this devlog yesterday lol, but i completed the site! Now only thing that is remaining is the form and the privcay policy page!
2
Log in to leave a comment
Comments
what a masterpiece!
@alarixfr thank you so much!
hello, i completed the pricing section today + animated it + also completed the CTA section and animated that aswell! Now i just need to tackle few more bugs that i am encountring in this and complete the form submission flow and also the footer
then we will be ready to launch! I think ill be able to wrap everything up by 2nd January!
0
Log in to leave a comment
did not do much today, but i finalized and polished the fold under animation for fourth section and made it so that it does not break after adding multiple services
this basically uses a formula like baseY * (index of the service card) and baseRotation * (index of th service card) for each service card baseY is -100 and baseRotation is 5degrees
0
Log in to leave a comment
Completed the fourth section as wellll! with that folding under animation for the services!
2
Log in to leave a comment
Comments
sveltee! :)
@AVD haha, thanks tho it’s react + vite
Completed the testimonials section (aka the wall of love!) and also animated it too!
2
Log in to leave a comment
Comments
Looking very good!
@bgtuik thank you twin 💖
Made the modal work and made it responsive!
0
Log in to leave a comment
i’ll animate this tommorow!
0
Log in to leave a comment
Made the second section fluid responsive and animated it!
0
Log in to leave a comment
Completed the second section too! gonna animate it tommorow!
3
Log in to leave a comment
Comments
Looking good, love the load animation!
It’s beautiful! Congratulations!
@bgtulk @ancamasi.2345 thank you so much guys!
Animated the first section too!
2
Log in to leave a comment
Comments
Wow, this looks good! I love the parallax background!
@MeBadDev Thank you soo much!
WOOOw FIRST SECTION DOONNNE LESS FUCKING GOO! LOOK AT THAT MARQUEE!!!!!
0
Log in to leave a comment
Yess! I made the text fluid responsive and created the secondary button as well!
0
Log in to leave a comment
WOAAHHHHHH WHAT THE HELL I JSUT CREATED LESSS GOO!!!!!
So i was just looking at the sites on awwwards.com then i saw this website -> https://www.ibi.cash/
The text dissolve effect caught my eyes, i thought it will be sooo cool to create it, so i did!!!!!!!
I used this shader from shadertoy to create it along with the cloud type noise for the dissolve effect
The shader: https://www.shadertoy.com/view/3tlXDS
1
Log in to leave a comment
Comments
And yess i forgot to tell but ill use this effect somewhere in this site too!
added the texts too! Now ill be creating the second variation of the button, as per the figma design!
0
Log in to leave a comment
Woooho i completed the navbar and menu! here is how it looks! (i was sick for a while so thats why havent done much yet)
0
Log in to leave a comment
Navbar done for desktop! Time to implement the mobile version now!
0
Log in to leave a comment
I have this design ready for my new portfolio! I will put life into this design this winter!
0
Log in to leave a comment