UX Design Projects in West BengalUX Design Projects in West Bengal
Cover image for Build a Meaningful Digital Ritual with GiveAFck365 App
Hi everyone, I’m showing GiveAFck365, a tiny daily ritual for giving a damn. In a world where it feels like no one gives a f*ck anymore, I wanted something simple and human; just one intentional act of care per day. So I created this little app for the Config Makeathon. GiveAF*ck365 gives you 365 f*cks at the start of the year, one for each day. You can drag a token from the Unsent jar into the Given jar as a personal acknowledgment, or send one to someone else as a small digital care token. No streak pressure. No gamification guilt. Just a quiet, physical-feeling daily ritual. The entire experience lives inside two glass jars on screen. Tokens pile up with satisfying physics, and when you send one, you choose from seven different types of care (Tough Love, Pure Care, Gratitude Bomb, and more). Each send returns a small random impact message that makes the interaction feel surprisingly meaningful. I built this as my first public project for the Config Makeathon, mostly because I wanted to stop watching everyone else's incredible projects and finally ship something myself. What it does 🧠 Two-jar drag-and-drop system with spring physics and satisfying landing bounce 🎯 7 unique care token types with custom names and descriptions 🔥 Gentle streak tracking + weekly counts focused on awareness, not pressure 💬 Random impact messages after every send "This one hit different." 🎉 Confetti bursts and interaction feedback when a token lands 📜 History drawer with token thumbnails, token types, and CSV export 💾 Automatic local saving via localStorage How I Built It The entire app - from blank canvas to working React prototype - was created and iterated entirely inside Figma Make, with zero context switching. Figma Make generated the complete React + TypeScript scaffold, component structure, and Tailwind-based design system. Using MCP tools and aesthetic-stance skills, I defined the visual language: a dark charcoal interface accented with warm orange highlights. Every iteration happened directly inside Make: - Fixed Radix forwardRef issues - Replaced random token positioning with a deterministic seeded system (eliminating visual jitter) - Redesigned the send experience into a visual 7-token selection grid - Added streak tracking and weekly insights - Implemented spring bounce physics on the Given jar - Added confetti interactions and motion polish - Unified history and token data structures for maintainability - Claude served as an AI pair programmer throughout the process, helping with debugging, feature implementation, and iteration directly inside the canvas. - The jar illustrations and token assets were sourced from Figma, and the entire workflow - design, code, debugging, and refinement - remained in a single environment from start to finish. What It Could Grow Into This foundation maps surprisingly well to an on-chain experience. Each daily token could become a unique ERC-1155 NFT (or similar on a better fit chain), with only 365 minted per year. Instead of simply sending a digital gesture, users could send actual care tokens directly to friends' wallets. The app already includes a stubbed "Connect Wallet" flow, making that evolution feel like a natural next step rather than a complete rebuild. Longer term, active participants who consistently give could receive airdrops of a playful GiveAF*ck meme token, unlock limited-edition token variants, or earn rare legendary "f*cks" tied to community milestones. What excites me most is the possibility of creating something unusual in web3: a product built around generosity rather than speculation. A wholesome social ritual that sits somewhere between meme culture, habit-building, and meaningful human connection. I'm genuinely open to collaborating with builders, designers, and web3 developers who would like to help turn this into a real on-chain experience. If this little ritual resonates with you or if you have your own version of wanting to give a fuck more intentionally I’d love to hear about it in the comments. Huge thanks to everyone sharing their work during Config Makeathon. Seeing your projects inspired me to stop overthinking and finally ship something. Links Live Prototype: https://giveafck365.figma.site (https://giveafck365.figma.site)Video Walkthrough: https://www.loom.com/share/99cdc09f767940f1b5eb48dc4080391f Figma Community File: https://www.figma.com/community/file/1649359320060581320/give-a-f-ck-365 (https://www.figma.com/community/file/1649359320060581320/give-a-f-ck-365)
13
29
602
Cover image for Christine Valmy International Academy of
Christine Valmy International Academy of Beauty – Kolkata Branch UX/UI Design Case Study | WordPress CMS Overview Christine Valmy Kolkata required a modern digital presence that reflected its international reputation in beauty education while improving lead generation, course discovery, and mobile usability. Problem The existing website faced several UX challenges: Outdated visual design that did not reflect a premium international beauty brand. Complex navigation made it difficult for prospective students to discover courses. Limited mobile optimization impacted usability and inquiries. Success stories and placement achievements lacked visibility and credibility. Static content management created dependency on developers for updates. Weak call-to-actions resulted in lower enquiry conversions. Research & Findings User interviews and heuristic evaluation identified four primary user goals: Explore available beauty and cosmetology courses. Verify certifications and international accreditations. Review student success stories and career outcomes. Contact counselors quickly for admissions guidance. UX Strategy The experience was redesigned around a clear student journey: Awareness → Course Discovery → Trust Building → Enquiry → Admission Key UX improvements included: Simplified information architecture. Clear course categorization. Prominent enquiry CTAs. Mobile-first responsive layouts. Trust signals through certifications and accreditations. Dedicated success stories and placement sections. UI Design Approach The visual language was inspired by luxury beauty and wellness brands. Color Palette Premium Magenta for actions and conversion elements. Soft Green for elegance and calmness. Neutral backgrounds for readability. Typography Large editorial headlines. High readability body text. Strong visual hierarchy for scanning. Components Course cards Testimonial modules Accreditation badges Sticky enquiry actions Mobile navigation patterns Solution Homepage Redesign Created a visually engaging hero section highlighting global certifications and career opportunities. Course Experience Structured course information with duration, curriculum, certifications, and outcomes. Success Stories Developed dedicated alumni pages showcasing placements and entrepreneurial journeys. Mobile Optimization Designed responsive layouts optimized for smartphones and tablets. CMS Implementation Built using WordPress CMS allowing staff to independently manage: Courses Success stories Blogs Events Placement updates SEO content Results Business Outcomes Increased enquiry visibility through stronger CTA placement. Improved course discoverability. Enhanced trust through accreditation presentation. Faster content publishing workflow using WordPress CMS. UX Outcomes Reduced navigation friction. Improved mobile browsing experience. Higher engagement with success stories and placement pages. Clearer conversion path from visitor to enquiry. Deliverables UX Audit Information Architecture Wireframes Responsive UI Design WordPress CMS Development SEO Foundation Setup Mobile Optimization Performance Optimization Technology Stack Platform: WordPress CMS Responsive Framework: Mobile First CMS Features: Dynamic Courses, Blog, Success Stories SEO: Search Engine Optimized Architecture Performance: Optimized Assets and Caching Project Impact The redesigned Christine Valmy Kolkata website successfully transformed a traditional informational website into a modern lead-generation platform that reflects the institution's premium international positioning while providing prospective students with a seamless and intuitive digital experience.
1
20