[{"data":1,"prerenderedAt":541},["ShallowReactive",2],{"case-en-wetterstudio":3,"related-cases-en-wetterstudio":138},{"_path":4,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":8,"description":9,"subtitle":10,"type":11,"client":8,"industries":12,"services":14,"timeline":18,"year":19,"featured":20,"order":21,"slug":22,"heroImage":23,"heroImageAlt":24,"question":25,"overview":26,"blocks":46,"techStack":118,"seoTitle":123,"seoDescription":124,"body":125,"_type":132,"_id":133,"_source":134,"_file":135,"_stem":136,"_extension":137},"/cases/wetterstudio","cases",false,"en","Wetterstudio Hiddensee","Website for the weather studio of Hiddensee island – informative and charming like the island itself.","Local weather data, lovingly presented","client",[13],"Media",[15,16,17],"Web Design","Development","Data Visualization","4 Weeks",2024,true,6,"wetterstudio","/media/projects/wetterstudio/mock.webp","Wetterstudio Hiddensee Website","How do you make weather data not just informative, but experiential?",{"headline":27,"text":28,"rail":29},"As inviting as the island itself","Wetterstudio Hiddensee has been providing reliable local weather data for years. But the old website was as old as some weather instruments. Data was there, but hard to read. No mobile optimization. No charm.",[30,33,40],{"type":31,"chip":32,"text":25},"question","The question",{"type":34,"chip":35,"items":36},"list","Story focus",[37,38,39],"Make practical value visible first","Use local character as differentiation","Build trust through clear data visualization",{"type":34,"chip":41,"items":42},"User moment",[43,44,45],"Know fast: beach day or rain jacket","Readable instantly on mobile","Charming enough for repeat visits",[47,61,67,72,79,85,96,103,106,113],{"type":48,"eyebrow":49,"items":50},"stats","Key Metrics",[51,54,58],{"value":52,"label":53},"12k","Daily Visitors",{"value":55,"unit":56,"label":57},"4.2","min","Time on Site",{"value":59,"label":60},"100%","Uptime",{"type":62,"eyebrow":63,"title":64,"paragraphs":65},"text","Our Approach","Weather is emotional",[66],"A glance at the thermometer decides between beach visit or museum marathon. That's why we didn't just visualize data – we made it experiential.",{"type":68,"src":69,"alt":70,"caption":71},"media","/media/projects/wetterstudio/landing-page.webp","Landing Page","Inviting landing page with live weather widget",{"type":34,"eyebrow":73,"title":74,"items":75},"Visual Design","Design Decisions",[76,77,78],"\u003Cstrong>Color scheme\u003C/strong> that changes with the weather (sun = warm, rain = cool)","\u003Cstrong>Illustrations\u003C/strong> of the island as background","\u003Cstrong>Clear typography\u003C/strong> for quick readability",{"type":34,"eyebrow":17,"title":80,"items":81},"Information at a glance",[82,83,84],"Live temperature display prominently in header","7-day forecast as timeline","Historical data as interactive charts",{"type":86,"items":87},"media-grid",[88,92],{"src":89,"alt":90,"caption":91},"/media/projects/wetterstudio/website-a.webp","Content Section","Informative content about the weather studio",{"src":93,"alt":94,"caption":95},"/media/projects/wetterstudio/website-b.webp","Features Section","TV broadcast times and lecture bookings",{"type":34,"eyebrow":97,"title":98,"items":99},"Solution","A website that",[100,101,102],"\u003Cstrong>Informs immediately\u003C/strong> – temperature in hero area","\u003Cstrong>Provides details\u003C/strong> – wind, precipitation, UV index","\u003Cstrong>Tells stories\u003C/strong> – blog with weather insights",{"type":68,"src":23,"alt":104,"caption":105},"Full Page Mockup","Full view of the website with island charm",{"type":48,"eyebrow":107,"items":108},"Results",[109,111],{"value":52,"label":110},"Daily visitors",{"value":55,"unit":56,"label":112},"Average time on site",{"type":62,"eyebrow":114,"title":115,"paragraphs":116},"Key Insight","More than just a thermometer",[117],"The new site has 12,000 daily visitors – many of them tourists planning their vacation around it. The average time on site of 4.2 minutes shows: People don't just check the thermometer.",[119,120,121,122],"Nuxt 3","Chart.js","Weather API","Netlify","Wetterstudio Hiddensee - Website | BitBitHooray","Case Study: How we visualized weather data for the Baltic island Hiddensee.",{"type":126,"children":127,"toc":128},"root",[],{"title":129,"searchDepth":130,"depth":130,"links":131},"",2,[],"markdown","content:en:cases:wetterstudio.md","content","en/cases/wetterstudio.md","en/cases/wetterstudio","md",[139,299,414],{"_path":140,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":141,"description":142,"subtitle":143,"type":11,"client":144,"industries":145,"services":147,"timeline":150,"year":19,"featured":20,"order":151,"slug":152,"heroImage":153,"heroImageAlt":154,"question":155,"overview":156,"blocks":172,"techStack":286,"seoTitle":290,"seoDescription":291,"body":292,"_type":132,"_id":296,"_source":134,"_file":297,"_stem":298,"_extension":137},"/cases/fabee","DJ Fabee","Website redesign and branding for the House DJ – modern, energetic, perfect for the electronic music scene.","Beats need a face","Fabee Music",[146],"Entertainment",[148,15,149],"Brand Identity","UI/UX Concept","2 Weeks",4,"fabee","/media/projects/fabee/logo.webp","DJ Fabee Website","How do you translate the energy of a House set into a website?",{"headline":157,"text":158,"rail":159},"A digital stage for DJs","Fabee Music is a House DJ from Germany with growing international presence. His sets combine emotional melodies with euphoric grooves. Our mission: A website redesign that reflects his musical identity.",[160,161,166],{"type":31,"chip":32,"text":155},{"type":34,"chip":35,"items":162},[163,164,165],"Make atmosphere and personality tangible first","Then prove booking relevance and professionalism","Use music as the conversion anchor",{"type":34,"chip":167,"items":168},"Buyer signal",[169,170,171],"Professional presence for event organizers","Fast access to music and events","Clear booking area instead of hidden contact",[173,177,182,188,201,205,209,213,216,221,239,247,253,259,268,276,281],{"type":68,"sectionClass":174,"src":175,"alt":176},"section--cover","/media/projects/fabee/grid.webp","DJ Fabee Website Overview",{"type":62,"sectionClass":178,"title":179,"paragraphs":180},"section--densed-y","\u003Cspan>FABEE\u003C/span> MUSIC",[181],"from Germany, is a dynamic force in the electronic music scene, known for setting dance floors ablaze with infectious beats and a seamless fusion of Afro House, Melodic House, and Tech House. His latest track, Tuine, has made waves by entering the Best new Melodic House Hype Picks on Beatport showcasing his talent as both a DJ and producer. (Credits: Text & Photos by Fabian Schumacher / Fabee Music)",{"type":68,"sectionClass":183,"media":184,"alt":187},"section--densed-bottom",{"type":185,"src":186},"video","/media/projects/fabee/showcase.mp4","Fabee Music Showcase Video",{"type":86,"items":189},[190,193,196,198],{"src":191,"alt":192},"/media/projects/fabee/mock.webp","Website Mockup",{"src":194,"alt":195},"/media/projects/fabee/nav.webp","Navigation Design",{"src":153,"alt":197},"Logo Design",{"src":199,"alt":200},"/media/projects/fabee/fabee.webp","Fabee Portrait",{"type":68,"sectionClass":178,"bgColor":202,"src":203,"alt":204},"#CDD7DE","/media/projects/fabee/music.webp","Music Section",{"type":62,"sectionClass":183,"title":206,"paragraphs":207},"Custom Music Player as Micro App",[208],"Feel the vibes of FABEE´s music by playing it seamlessly on every page of the website and also on your phone.",{"type":68,"src":210,"alt":211,"caption":212},"/media/projects/fabee/player.webp","Custom Music Player","Custom music player as micro-app – plays on every page",{"type":68,"src":214,"alt":215},"/media/projects/fabee/playerMini.webp","Music Player Mobile",{"type":68,"sectionClass":183,"bgColor":217,"src":218,"alt":219,"caption":220},"#e0d9d1","/media/projects/fabee/about.webp","About Section","Personal story and DJ philosophy",{"type":86,"bgColor":217,"items":222},[223,227,231,235],{"src":224,"alt":225,"caption":226},"/media/projects/fabee/events.webp","Events Overview","Upcoming Events",{"src":228,"alt":229,"caption":230},"/media/projects/fabee/event.webp","Event Details","Event details",{"src":232,"alt":233,"caption":234},"/media/projects/fabee/contact.webp","Booking Area","Booking area",{"src":236,"alt":237,"caption":238},"/media/projects/fabee/media.webp","Media Kit","Media stuff",{"type":48,"eyebrow":107,"items":240},[241,244],{"value":242,"label":243},"+200%","More booking requests",{"value":245,"unit":56,"label":246},"2.1","Session duration",{"type":62,"eyebrow":248,"title":249,"paragraphs":250},"Discovery","The Starting Point",[251,252],"We deeply explored Fabee's musical identity: \u003Cstrong>Sound\u003C/strong> – House music with emotional melodies and euphoric grooves. \u003Cstrong>Venues\u003C/strong> – Beach clubs, festivals, alpine venues. \u003Cstrong>Target audience\u003C/strong> – Event organizers, club operators, festival bookers.","\u003Cstrong>Key Insight:\u003C/strong> The website must convey the atmosphere of his sets – nightlife, energy, professionalism.",{"type":62,"eyebrow":254,"title":255,"paragraphs":256},"Design Concept","Dark Theme as Foundation",[257,258],"Black background like a club at midnight. Subtle gradients in brand colors. High-quality event photos in full width.","\u003Cstrong>Typography:\u003C/strong> Clean, modern sans-serif for readability. High-contrast headlines. Plenty of whitespace for elegance.",{"type":34,"eyebrow":260,"title":261,"items":262},"User Experience","Content Hierarchy",[263,264,265,266,267],"\u003Cstrong>Hero:\u003C/strong> Instant recognition of who Fabee is","\u003Cstrong>About:\u003C/strong> Storytelling – from Germany to international stages","\u003Cstrong>Shows:\u003C/strong> Upcoming events prominently displayed","\u003Cstrong>Music:\u003C/strong> Embedded tracks & Beatport links","\u003Cstrong>Booking:\u003C/strong> Direct contact without detours",{"type":34,"eyebrow":269,"title":270,"items":271},"Deliverables","What We Delivered",[272,273,274,275],"\u003Cstrong>Brand Guidelines\u003C/strong> – Logo variants, color palette, typography system","\u003Cstrong>Website Redesign (Figma)\u003C/strong> – Desktop & mobile designs, interactive prototype","\u003Cstrong>Content Strategy\u003C/strong> – Improved copy, event presentation","\u003Cstrong>Asset Package\u003C/strong> – Optimized images, social media templates, press kit",{"type":62,"eyebrow":277,"title":278,"paragraphs":279},"Special Feature","Music-First Approach",[280],"The website puts music at the center: \u003Cstrong>Embedded player\u003C/strong> on every page. Spotify/Beatport integration. Latest releases prominently featured.",{"type":62,"eyebrow":282,"title":283,"paragraphs":284},"About Fabee","Internationally Known",[285],"Fabee Music is known for: Releases on labels like Café De Anatolia. Festival appearances incl. Parookaville. Support for acts like Topic and David Puentez. International shows from Thailand to Munich.",[287,288,289],"Figma","Bandzoogle","Brand Guidelines","DJ Fabee Music - Website Redesign | BitBitHooray","Case Study: Website redesign for House DJ Fabee Music – dark club aesthetic, professional booking interface.",{"type":126,"children":293,"toc":294},[],{"title":129,"searchDepth":130,"depth":130,"links":295},[],"content:en:cases:fabee.md","en/cases/fabee.md","en/cases/fabee",{"_path":300,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":301,"description":302,"subtitle":303,"type":11,"client":304,"industries":305,"services":307,"timeline":311,"year":19,"featured":20,"order":130,"slug":312,"heroImage":313,"heroImageAlt":314,"question":315,"overview":316,"blocks":332,"techStack":402,"seoTitle":405,"seoDescription":406,"body":407,"_type":132,"_id":411,"_source":134,"_file":412,"_stem":413,"_extension":137},"/cases/freyanda","Freyanda","Website and app concept for pregnancy coaching, yoga courses and personal coaching – modern, empathetic, conversion-optimized.","Women's health digitally supported","Freyanda - Women's Health",[306],"Health",[15,308,309,310],"Nuxt Development","UX/UI","App Concept","6 Weeks","freyanda","/media/projects/freyanda/logo.webp","Freyanda website on various devices","How do you build trust digitally – especially for something as sensitive as pregnancy?",{"headline":317,"text":318,"rail":319},"A digital home for women's health","Freyanda is a holistic coaching offer from Sarah Schmidt, a pre- and postnatal coach, yoga trainer for pregnant women, and mom. The range includes prenatal yoga, postnatal recovery courses, children's yoga, personal coaching and trauma support.",[320,321,326],{"type":31,"chip":32,"text":315},{"type":34,"chip":35,"items":322},[323,324,325],"Put emotional safety before selling","Translate expertise into warmth and clarity","Offer booking only after trust and orientation",{"type":34,"chip":327,"items":328},"Conversion lever",[329,330,331],"Warm language lowers hesitation","Clear offers make decisions easier","Fast loading protects the first impression",[333,345,351,354,359,367,371,378,385,396],{"type":48,"eyebrow":49,"items":334},[335,338,341],{"value":336,"label":337},"+180%","More Course Signups",{"value":339,"label":340},"0.9s","Load Time",{"value":342,"unit":343,"label":344},"4.8","★","Google Rating",{"type":62,"eyebrow":346,"title":347,"paragraphs":348},"The Challenge","Too much expertise, too little visibility",[349,350],"Sarah had a problem many coaches know: No unified digital presence. Course bookings went through awkward phone calls. The target audience is online-savvy, but the presence wasn't.","\u003Cstrong>Our goal:\u003C/strong> A digital home for Freyanda – as warm-hearted as the service itself.",{"type":68,"src":313,"alt":352,"caption":353},"Freyanda Logo","Soft, inviting branding",{"type":62,"eyebrow":248,"title":355,"paragraphs":356},"We listened first",[357,358],"What makes Freyanda unique? What fears and wishes do expectant mothers have? How can we build trust digitally?","\u003Cstrong>Key Insight:\u003C/strong> Women in pregnancy aren't just looking for courses – they're looking for connection and security.",{"type":34,"eyebrow":360,"title":361,"items":362},"Design Principles","Warm-hearted & inviting",[363,364,365,366],"\u003Cstrong>Soft, warm colors\u003C/strong> – no clinical white, but organic tones","\u003Cstrong>Real photos\u003C/strong> instead of stock – Sarah and real participants","\u003Cstrong>Simple language\u003C/strong> – no jargon, but heart-speak","\u003Cstrong>Mobile-first\u003C/strong> – 78% of the target audience comes from smartphones",{"type":62,"eyebrow":97,"title":368,"paragraphs":369},"Modern website with course booking",[370],"A Nuxt 3 website with: \u003Cstrong>Clear course overview\u003C/strong> – all offerings at a glance. \u003Cstrong>Online booking system\u003C/strong> – direct signup without detours. \u003Cstrong>Calendar integration\u003C/strong> – all appointments synced. \u003Cstrong>Newsletter connection\u003C/strong> – for regular tips and updates.",{"type":34,"eyebrow":372,"title":373,"items":374},"For Participants","Website Features",[375,376,377],"Clear course pages with all details","Easy online booking","Personal about-me page that builds trust",{"type":34,"eyebrow":379,"title":380,"items":381},"For Sarah","Admin Features",[382,383,384],"Independent course management","Easy content updates","Analytics for better marketing",{"type":48,"eyebrow":107,"items":386},[387,390,394],{"value":388,"label":389},"~42","Signups/month (was ~15)",{"value":391,"unit":392,"label":393},"2","clicks","Path to booking",{"value":339,"label":395},"Load time (was 3.8s)",{"type":397,"eyebrow":398,"quote":399,"author":400,"role":401},"quote","Testimonial","BitBitHooray understood what women's health really needs: trust, mindfulness, and a website that reflects that. Bookings have tripled.","Sarah Schmidt","Founder Freyanda",[119,403,122,404],"SCSS","Booking Integration","Freyanda Case Study | Women's Health Website | BitBitHooray","Website and app concept for Freyanda: Pregnancy support, yoga & coaching digitally designed. +180% more course signups.",{"type":126,"children":408,"toc":409},[],{"title":129,"searchDepth":130,"depth":130,"links":410},[],"content:en:cases:freyanda.md","en/cases/freyanda.md","en/cases/freyanda",{"_path":415,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":416,"description":417,"subtitle":418,"type":11,"client":419,"industries":420,"services":422,"timeline":427,"year":19,"featured":20,"order":428,"slug":429,"heroImage":430,"heroImageAlt":431,"question":432,"overview":433,"blocks":449,"techStack":528,"seoTitle":532,"seoDescription":533,"body":534,"_type":132,"_id":538,"_source":134,"_file":539,"_stem":540,"_extension":137},"/cases/quiz-champions","Quiz Champions","Gamified e-learning app that combines knowledge transfer with game mechanics.","Collect knowledge. Collect avatars. Become a champion!","TH Wildau / Research Project",[421],"EdTech",[423,424,425,426],"UX Design","UI Design","Fullstack Development","Gamification","3 Months",3,"quiz-champions","/media/projects/quiz/leaderboard.webp","Quiz Champions Leaderboard","How can we motivate people to actually learn – not just complete courses?",{"headline":434,"text":435,"rail":436},"An addictive learning app – in a good way","Teaching knowledge is easy. Getting people to actually learn – that's hard. Traditional e-learning platforms are boring. Users drop out, forget content, never come back. We applied game mechanics from apps like Candy Crush and Duolingo to serious learning.",[437,438,443],{"type":31,"chip":32,"text":432},{"type":34,"chip":35,"items":439},[440,441,442],"Frame the motivation problem first","Show the game loop before proving impact","Keep metrics for the dedicated proof section",{"type":34,"chip":444,"items":445},"Why it works",[446,447,448],"Collection mechanics create return visits","Competition builds momentum","Rewards make progress visible",[450,460,465,474,482,492,500,510,514,524],{"type":48,"eyebrow":49,"items":451},[452,455,458],{"value":453,"label":454},"47%","More Learning Time",{"value":456,"label":457},"89%","Retention Rate",{"value":342,"unit":343,"label":459},"User Rating",{"type":62,"eyebrow":346,"title":461,"paragraphs":462},"Traditional e-learning doesn't work",[463,464],"What makes games like Candy Crush or Duolingo so successful? \u003Cstrong>Dopamine loops\u003C/strong>, clear progress, social elements.","We applied these principles to knowledge transfer.",{"type":86,"items":466},[467,470],{"src":430,"alt":468,"caption":469},"Leaderboard","The moment learning turns into a leaderboard chase",{"src":471,"alt":472,"caption":473},"/media/projects/quiz/avatare.webp","Avatar System","Rewards worth collecting, not just points to forget",{"type":34,"eyebrow":475,"title":476,"items":477},"Approach","Game mechanics for learning",[478,479,480,481],"\u003Cstrong>Short sessions\u003C/strong> (5-10 min) instead of long learning units","\u003Cstrong>Instant feedback\u003C/strong> on every answer","\u003Cstrong>Visual rewards\u003C/strong> (avatars, badges)","\u003Cstrong>Leaderboards\u003C/strong> for healthy competition",{"type":86,"items":483},[484,488],{"src":485,"alt":486,"caption":487},"/media/projects/quiz/question.webp","Quiz Interface","One question, one tap, instant momentum",{"src":489,"alt":490,"caption":491},"/media/projects/quiz/shop.webp","In-Game Shop","Earned coins become the next character unlock",{"type":34,"eyebrow":493,"title":494,"items":495},"Design","Colors & Visuals",[496,497,498,499],"\u003Cstrong>Bold, energetic colors\u003C/strong> that signal activity","\u003Cstrong>Characters with personality\u003C/strong> instead of generic icons","\u003Cstrong>Micro-animations\u003C/strong> on every success","\u003Cstrong>Streak counters\u003C/strong> (\"7 days in a row!\")",{"type":86,"items":501},[502,506],{"src":503,"alt":504,"caption":505},"/media/projects/quiz/profile.webp","User Profile","Progress packaged like a real player profile",{"src":507,"alt":508,"caption":509},"/media/projects/quiz/trophies.webp","Trophy System","Achievements that give users a reason to return",{"type":62,"eyebrow":97,"title":511,"paragraphs":512},"A native-feeling web app",[513],"\u003Cstrong>Quiz engine\u003C/strong> with adaptive difficulty. \u003Cstrong>Avatar system\u003C/strong> with 50+ unlockable characters. \u003Cstrong>Categories\u003C/strong> for different knowledge areas. \u003Cstrong>Multiplayer mode\u003C/strong> against friends.",{"type":48,"eyebrow":107,"items":515},[516,519,521],{"value":517,"label":518},"+47%","More time learning",{"value":456,"label":520},"7-day retention",{"value":522,"label":523},"~20%","Industry average",{"type":62,"eyebrow":114,"title":525,"paragraphs":526},"Gamification works",[527],"Users spend 47% more time learning compared to traditional quiz apps. 7-day retention is 89% – far above the industry average of ~20%.",[529,530,531,287],"Vue.js","Laravel","MySQL","Quiz Champions - Gamified Learning | BitBitHooray","Case Study: How we developed an e-learning app that teaches through play.",{"type":126,"children":535,"toc":536},[],{"title":129,"searchDepth":130,"depth":130,"links":537},[],"content:en:cases:quiz-champions.md","en/cases/quiz-champions.md","en/cases/quiz-champions",1782424351635]