👩🏽💻 Front End Dev @tentwentyMe 🎯 ᴄᴜʀʀᴇɴᴛʟʏ ꜱᴇʟꜰ-ʟᴇᴀʀɴɪɴɢ React, 👑 UX/UI Designer, ✨ᴛᴇᴄʜ ʙʟᴏɢɢᴇʀ @ThePracticalDev, ɪɴᴛᴊ-ᴀ #ᴄᴏᴅᴇɴᴇᴡʙɪᴇ
Coding Zone
Joined February 2020
- Tweets2.5K
- Following646
- Followers1.5K
- Likes9.1K
Pinned Tweet
Day 83 - 88 #100DaysOfCode
Since it's my birthday today, I worked on a colour theme and finally published it. Hahah Nairobi Night is a gift to me and you, I love the feedback so far.
THE CITY UNDER THE SUN. #HappyBirthdaty to me 🎂.
marketplace.visualstudio.com…
#CodeNewbie
🆎 New Component alert !!!
DERIVA - Scroll Gallery
Most infinite-scroll galleries are the same shape: a flat filmstrip growing from a fixed point on one side.
framer.link/R4sFghF
#Framer #BuildinginPublic
Considering the cost of tokens is cheaper if you use Kimi K3, me switching from Fable 5 is a good idea. 👌
This quoted post is unavailable.
Jane Tracy 👩💻 retweeted
GPT-5.6 Sol just changed how I build websites with AI.
In this full 10-minute video, I test Sol and Terra inside Codex to build a cinematic landing page from a video reference.
I cover:
→ Which GPT-5.6 model to use
→ How I analyze a full website experience
→ How I recreate the layout, motion and interactions
→ Why better prompting matters more than one-shot results
→ How to avoid generic AI slop
The model matters—but the way you guide it matters even more.
Watch the full process below 👇
Want the free template and the exact prompt I used? They’re available exclusively in the description of the YouTube version: youtu.be/5o5PnTd5l_4
New Component Alert !!
Turn scroll position into motion frame-scrubbed video, looping video, or a static hero photo, one component, three variants. Drop in, customise, publish.
framer.link/lTx9q0j
#Framer #Buildinginpublic
Try out the ripple loader in any website to give it a fresh look.
Ripple rings expand from centre, your logo rises, and up to 6 product images orbit in a smooth merry-go-round. Drop in, customise, publish.
framer.link/lKHBuHP
#Framer #BuildinginPublic
😃 New Component alert !!!
Full Description
Ondula is a full-screen page loader built for brands that care about every detail including the two seconds before your page appears.
Enjoy and have fun with it. 😃
#framer
#Buildinginpublic
framer.link/lKHBuHP
Jane Tracy 👩💻 retweeted
New skill: /apple-design
Apple’s WWDC videos are a goldmine of knowledge. I’ve combed through my favorite ones and came up with 17 design and motion principles.
Use them to review existing work or when working on something new to get it right.
github.com/emilkowalski/skil…
Jane Tracy 👩💻 retweeted
the way design operates at @AnthropicAI is consistently 3-6 months ahead of the rest of the industry
it's partly why @meaghaneschoi (Design Lead for Claude Code) is one of my fav people to learn from
there's a TON of alpha in this week's episode (including the big shift in how they're collaborating with Claude internally) 👇
Step into Flashback Booth pick a city, take 4 shots, and travel back to the 1980s. Download your strip instantly.
My hackthon fun project with @framer 😊🙌
#framer
framer.com/community/contest…
We ready for the new updates. 🤗
Go stream
We’re live. Tune in now as we count down. youtube.com/watch?v=j4WW4bwW…
Arcus is a cinematic full-screen page loader for Framer, built around a signature three-layer curved panel wipe. Each coloured panel sweeps upward in sequence. 👌🔥
framer.com/marketplace/compo…
#Framer
#Buildinginpublic
Drop in up to 8 PNG images with transparent backgrounds ingredients, products, icons, anything with shape.
It's responsive to all devices too.
Have fun with nimbus 🌟🎨✨️
framer.com/marketplace/compo…
#framer #Buildinginpublic
Jane Tracy 👩💻 retweeted
Okay, haters saying this is a shitpost and fake. Well no, I don't do these kind of posts 😭
HERES THE PROMPT
Use the image-to-code web skill. github.com/Leonxlnx/taste-sk… (for image gen)
Create a landing page using the materials I provide. Please read everything completely.
Generate 8 images total. Each image should represent one section of the website, so there should be 8 sections in total.
The website should be ultra-clean, modern, and at the level of these references:
landonorris.com/
mindmarket.com/
shopify.com/editions/winter2…
oryzo.ai/
floema.com/en
mistral.ai/
Please generate the images based on the reference images I provide from these websites. Then, your task is to recreate the generated images in code.
Extract all individual elements from the generated images and regenerate them with image generation so they can be used as separate assets. Then use those assets to build the final website with extremely smooth animations.
The site can be about anything. Just make it creative, animated, aesthetic, and really cool.
Please make the website awesome and check everything carefully.
-----
YES just like that. Inspo + image2code + Fable is CRAZY
