{"id":7045,"date":"2017-03-09T11:58:29","date_gmt":"2017-03-09T11:58:29","guid":{"rendered":"https:\/\/www.mozaik.com\/blog\/?p=7045"},"modified":"2024-10-29T15:42:29","modified_gmt":"2024-10-29T15:42:29","slug":"three-cents-fizz-way-digital-world","status":"publish","type":"post","link":"https:\/\/www.mozaik.com\/blog\/three-cents-fizz-way-digital-world\/","title":{"rendered":"Three Cents Fizz their way to the Digital World"},"content":{"rendered":"<p style=\"text-align: left;\"><strong>Combining their know-how and expertise<\/strong> with their <strong>passion for cocktail science<\/strong>, a team of determined <strong>bartenders created a line of premium artisanal beverages<\/strong> having bartenders in mind. In less than three years of operation <strong>Three Cents are leading the market of premium soda mixers<\/strong> and have already established a distribution network throughout the world.<\/p>\n<p style=\"text-align: left;\">Always supporting new visions, inspiration and talent, <strong>Mozaik undertook the creation and development of the Three Cents website<\/strong>. Inspired by the inventive character and the <strong>pioneering spirit<\/strong> of the Three Cents team, Mozaik envisioned a <strong>new cool and brisk online presence<\/strong> so as to properly introduce the Three Cents brand and products to the digital world.<\/p>\n<p style=\"text-align: left;\">Based on a <strong>story telling concept<\/strong>, the brand new website of Three Cents tells the story of <strong>carbonation and soda making<\/strong>, taking browsers on an invigorating <strong>journey from the inception to the implementation<\/strong> of the Three Cents products.<\/p>\n<p style=\"text-align: left;\"><img loading=\"lazy\" class=\"alignnone size-full wp-image-7127\" src=\"https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/3-cents_2.jpg\" alt=\"three cents\" width=\"745\" height=\"475\" srcset=\"https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/3-cents_2.jpg 745w, https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/3-cents_2-300x191.jpg 300w, https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/3-cents_2-330x210.jpg 330w, https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/3-cents_2-280x180.jpg 280w\" sizes=\"(max-width: 745px) 100vw, 745px\" \/><\/p>\n<p style=\"text-align: left;\">The story begins from the homepage with the <strong>animated journey of the bubbles<\/strong> that is brilliantly illustrated with a series of <strong>vintage sketches<\/strong> introducing visitors to the soda making industry. As the story unfolds through animation, the website breathes its way to the modern era.<\/p>\n<p style=\"text-align: left;\">The <strong>pale color coding of the website<\/strong> is inspired by the vintage labels of the Three Cents bottles and <strong>in contrast with the bold yet fresh images<\/strong> reflecting the company\u2019s logo evokes the sprightful and original character of the Three Cents brand.<\/p>\n<p style=\"text-align: left;\">The <strong>animations and twists between sketches and images<\/strong> along with the parallax scrolling add a sharp bar-like look and feel to the atmosphere that is stylishly enhanced with the bubbling effects, the beautiful <strong>color images of the ingredients<\/strong> and the <strong>H2O environment<\/strong> while at the same time conveying the scientific know-how, the outstanding creativity and bartending field of expertise of the Three Cents.<\/p>\n<p style=\"text-align: left;\"><img loading=\"lazy\" class=\"alignnone wp-image-9234 size-full\" src=\"https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/01.jpg\" alt=\"\" width=\"640\" height=\"1627\" srcset=\"https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/01.jpg 640w, https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/01-118x300.jpg 118w, https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/01-403x1024.jpg 403w, https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/01-604x1536.jpg 604w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/><\/p>\n<p style=\"text-align: left;\"><strong>Developing for the bubbles\u2026<\/strong><\/p>\n<p style=\"text-align: left;\">The biggest challenge we faced during the development of the Three Cents website, was the narrative homepage. <strong>Unique illustrations<\/strong> were created, combined in a great web design. Trying to bring that to life, we decided to go with the <strong>use of frame by frame animations enriched with user-controlled effects<\/strong>. Once again Mozaik\u2019s development team was pumped to experiment. <strong>Using pixi.js, an advanced 2D JavaScript animation framework, with WebGL techniques<\/strong>, where applicable, and a <strong>canvas fallback<\/strong>, we managed to bring the bubbles of Three Cents beverages to life<img loading=\"lazy\" class=\"alignnone wp-image-9239 size-full\" src=\"https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/3-cents_ipad.jpg\" alt=\"\" width=\"750\" height=\"655\" srcset=\"https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/3-cents_ipad.jpg 750w, https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/3-cents_ipad-300x262.jpg 300w\" sizes=\"(max-width: 750px) 100vw, 750px\" \/><\/p>\n<p style=\"text-align: left;\">Having a strong narrative homepage did not put us at rest when developing the rest of the pages. <strong>CSS animations, parallax effects, styled maps<\/strong> with custom bubbly animations are present throughout the website. All that, wrapped in a <strong>responsive code<\/strong> that transfers the <strong>fruity bubble effect in all devices and screen sizes<\/strong>.<\/p>\n<p style=\"text-align: left;\">That said, we welcome you to discover the secrets of soda making by <strong>following the journey of Three Cents<\/strong> to the creation of the Three Cents line of <strong>Artisanal Beverages and Premium Soda Mixers<\/strong>.<\/p>\n<p style=\"text-align: left;\">Check the new website of Three Cents\u00a0here: <a href=\"http:\/\/www.threecents.gr\/\" target=\"_blank\" rel=\"noopener\">www.threecents.gr<\/a><\/p>\n<p>&nbsp;<\/p>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-9237 size-full\" src=\"https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/02-1.jpg\" alt=\"\" width=\"640\" height=\"1730\" srcset=\"https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/02-1.jpg 640w, https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/02-1-111x300.jpg 111w, https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/02-1-379x1024.jpg 379w, https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/02-1-568x1536.jpg 568w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/><\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Combining their know-how and expertise with their passion for cocktail science, a team of determined bartenders created a line of premium artisanal beverages having bartenders in mind. In less than three years of operation Three Cents are leading the market of premium soda mixers and have already established a distribution network throughout the world. Always [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":7049,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[111],"tags":[115,112,125,60],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v19.8 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Three Cents Fizz their way to the Digital World - Mozaik Agency Blog<\/title>\n<meta name=\"description\" content=\"We welcome you to discover the secrets of soda making by following the journey of Three Cents Artisanal Beverages and Premium Soda Mixers.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.mozaik.com\/blog\/three-cents-fizz-way-digital-world\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Three Cents Fizz their way to the Digital World - Mozaik Agency Blog\" \/>\n<meta property=\"og:description\" content=\"We welcome you to discover the secrets of soda making by following the journey of Three Cents Artisanal Beverages and Premium Soda Mixers.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.mozaik.com\/blog\/three-cents-fizz-way-digital-world\/\" \/>\n<meta property=\"og:site_name\" content=\"Mozaik Journal\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/MozaikOnline\/?fref=ts\" \/>\n<meta property=\"article:published_time\" content=\"2017-03-09T11:58:29+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-10-29T15:42:29+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/main03.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"746\" \/>\n\t<meta property=\"og:image:height\" content=\"475\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"mozaik\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@mozaikagency\" \/>\n<meta name=\"twitter:site\" content=\"@mozaikagency\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"mozaik\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.mozaik.com\/blog\/three-cents-fizz-way-digital-world\/\",\"url\":\"https:\/\/www.mozaik.com\/blog\/three-cents-fizz-way-digital-world\/\",\"name\":\"Three Cents Fizz their way to the Digital World - Mozaik Agency Blog\",\"isPartOf\":{\"@id\":\"https:\/\/www.mozaik.com\/blog\/#website\"},\"datePublished\":\"2017-03-09T11:58:29+00:00\",\"dateModified\":\"2024-10-29T15:42:29+00:00\",\"author\":{\"@id\":\"https:\/\/www.mozaik.com\/blog\/#\/schema\/person\/0d09103aa252462df2b6445f7f3ff533\"},\"description\":\"We welcome you to discover the secrets of soda making by following the journey of Three Cents Artisanal Beverages and Premium Soda Mixers.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.mozaik.com\/blog\/three-cents-fizz-way-digital-world\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.mozaik.com\/blog\/three-cents-fizz-way-digital-world\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.mozaik.com\/blog\/three-cents-fizz-way-digital-world\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.mozaik.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Three Cents Fizz their way to the Digital World\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.mozaik.com\/blog\/#website\",\"url\":\"https:\/\/www.mozaik.com\/blog\/\",\"name\":\"Mozaik Journal\",\"description\":\"Mozaik Journal Blog\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.mozaik.com\/blog\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.mozaik.com\/blog\/#\/schema\/person\/0d09103aa252462df2b6445f7f3ff533\",\"name\":\"mozaik\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.mozaik.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/c82a5c3832bbe410d93d8f2f8af39da3?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/c82a5c3832bbe410d93d8f2f8af39da3?s=96&d=mm&r=g\",\"caption\":\"mozaik\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Three Cents Fizz their way to the Digital World - Mozaik Agency Blog","description":"We welcome you to discover the secrets of soda making by following the journey of Three Cents Artisanal Beverages and Premium Soda Mixers.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.mozaik.com\/blog\/three-cents-fizz-way-digital-world\/","og_locale":"en_US","og_type":"article","og_title":"Three Cents Fizz their way to the Digital World - Mozaik Agency Blog","og_description":"We welcome you to discover the secrets of soda making by following the journey of Three Cents Artisanal Beverages and Premium Soda Mixers.","og_url":"https:\/\/www.mozaik.com\/blog\/three-cents-fizz-way-digital-world\/","og_site_name":"Mozaik Journal","article_publisher":"https:\/\/www.facebook.com\/MozaikOnline\/?fref=ts","article_published_time":"2017-03-09T11:58:29+00:00","article_modified_time":"2024-10-29T15:42:29+00:00","og_image":[{"width":746,"height":475,"url":"https:\/\/www.mozaik.com\/blog\/wp-content\/uploads\/2017\/03\/main03.jpg","type":"image\/jpeg"}],"author":"mozaik","twitter_card":"summary_large_image","twitter_creator":"@mozaikagency","twitter_site":"@mozaikagency","twitter_misc":{"Written by":"mozaik","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.mozaik.com\/blog\/three-cents-fizz-way-digital-world\/","url":"https:\/\/www.mozaik.com\/blog\/three-cents-fizz-way-digital-world\/","name":"Three Cents Fizz their way to the Digital World - Mozaik Agency Blog","isPartOf":{"@id":"https:\/\/www.mozaik.com\/blog\/#website"},"datePublished":"2017-03-09T11:58:29+00:00","dateModified":"2024-10-29T15:42:29+00:00","author":{"@id":"https:\/\/www.mozaik.com\/blog\/#\/schema\/person\/0d09103aa252462df2b6445f7f3ff533"},"description":"We welcome you to discover the secrets of soda making by following the journey of Three Cents Artisanal Beverages and Premium Soda Mixers.","breadcrumb":{"@id":"https:\/\/www.mozaik.com\/blog\/three-cents-fizz-way-digital-world\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.mozaik.com\/blog\/three-cents-fizz-way-digital-world\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.mozaik.com\/blog\/three-cents-fizz-way-digital-world\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.mozaik.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Three Cents Fizz their way to the Digital World"}]},{"@type":"WebSite","@id":"https:\/\/www.mozaik.com\/blog\/#website","url":"https:\/\/www.mozaik.com\/blog\/","name":"Mozaik Journal","description":"Mozaik Journal Blog","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.mozaik.com\/blog\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.mozaik.com\/blog\/#\/schema\/person\/0d09103aa252462df2b6445f7f3ff533","name":"mozaik","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.mozaik.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/c82a5c3832bbe410d93d8f2f8af39da3?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/c82a5c3832bbe410d93d8f2f8af39da3?s=96&d=mm&r=g","caption":"mozaik"}}]}},"_links":{"self":[{"href":"https:\/\/www.mozaik.com\/blog\/wp-json\/wp\/v2\/posts\/7045"}],"collection":[{"href":"https:\/\/www.mozaik.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.mozaik.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.mozaik.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.mozaik.com\/blog\/wp-json\/wp\/v2\/comments?post=7045"}],"version-history":[{"count":14,"href":"https:\/\/www.mozaik.com\/blog\/wp-json\/wp\/v2\/posts\/7045\/revisions"}],"predecessor-version":[{"id":9240,"href":"https:\/\/www.mozaik.com\/blog\/wp-json\/wp\/v2\/posts\/7045\/revisions\/9240"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.mozaik.com\/blog\/wp-json\/wp\/v2\/media\/7049"}],"wp:attachment":[{"href":"https:\/\/www.mozaik.com\/blog\/wp-json\/wp\/v2\/media?parent=7045"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.mozaik.com\/blog\/wp-json\/wp\/v2\/categories?post=7045"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.mozaik.com\/blog\/wp-json\/wp\/v2\/tags?post=7045"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}