{"id":342,"date":"2019-01-09T14:01:15","date_gmt":"2019-01-09T14:01:15","guid":{"rendered":"http:\/\/themes.wip-themes.com\/aiteko\/?post_type=portfolio&#038;p=342"},"modified":"2021-08-18T16:28:45","modified_gmt":"2021-08-18T16:28:45","slug":"celonic-ag-3d","status":"publish","type":"portfolio","link":"https:\/\/team4design.com\/en\/portfolio\/celonic-ag-3d\/","title":{"rendered":"Celonic AG"},"content":{"rendered":"<h3>The Challenge<\/h3>\n<p>The challenge of our team was to build a 3D Ball rotating on itself and has 360 \u00b0 with the function of opening when you click on it.<\/p>\n<div style=\"width: 640px;\" class=\"wp-video\"><!--[if lt IE 9]><script>document.createElement('video');<\/script><![endif]-->\n<video class=\"wp-video-shortcode\" id=\"video-342-1\" width=\"640\" height=\"360\" preload=\"metadata\" controls=\"controls\"><source type=\"video\/mp4\" src=\"https:\/\/team4design.com\/wp-content\/uploads\/2019\/02\/Celonic-3D-Animation-Le-challenge.mp4?_=1\" \/><a href=\"https:\/\/team4design.com\/wp-content\/uploads\/2019\/02\/Celonic-3D-Animation-Le-challenge.mp4\">https:\/\/team4design.com\/wp-content\/uploads\/2019\/02\/Celonic-3D-Animation-Le-challenge.mp4<\/a><\/video><\/div>\n<figure><img src=\"https:\/\/team4design.com\/wp-content\/uploads\/2019\/01\/celonic_3-1-1024x518.jpg\" alt=\"celonic_3\" \/><\/figure>\n<p>&nbsp;<\/p>\n<figure><img src=\"https:\/\/team4design.com\/wp-content\/uploads\/2019\/01\/celonic_4-1-1024x518.jpg\" alt=\"celonic_4\" \/><\/figure>\n<p>&nbsp;<\/p>\n<figure><img src=\"https:\/\/team4design.com\/wp-content\/uploads\/2019\/01\/celonic_5-1-1024x518.jpg\" alt=\"celonic_5\" \/><\/figure>\n<p>&nbsp;<\/p>\n<figure><img src=\"https:\/\/team4design.com\/wp-content\/uploads\/2019\/01\/celonic_6-1-1024x518.jpg\" alt=\"celonic_6\" \/><\/figure>\n<p>&nbsp;<\/p>\n<figure><img src=\"https:\/\/team4design.com\/wp-content\/uploads\/2019\/01\/celonic_7-1-1024x518.jpg\" alt=\"celonic_7\" \/><\/figure>\n<p>&nbsp;<\/p>\n<figure><img src=\"https:\/\/team4design.com\/wp-content\/uploads\/2019\/01\/celonic_8-1-1024x518.jpg\" alt=\"celonic_8\" \/><\/figure>\n<p>&nbsp;<\/p>\n<figure><img src=\"https:\/\/team4design.com\/wp-content\/uploads\/2019\/01\/celonic_9-1-1024x518.jpg\" alt=\"celonic_9\" \/><\/figure>\n<p>&nbsp;<\/p>\n<figure><img src=\"https:\/\/team4design.com\/wp-content\/uploads\/2019\/01\/celonic_10-1-1024x518.jpg\" alt=\"celonic_10\" \/><\/figure>\n<p>Pr\u00e9c\u00e9dent<br \/>\nSuivant<\/p>\n<h3>The Concept<\/h3>\n<p>Built a sphere element in 3D, while styling of the website is backed up with famous Bootstrap framework, and everything together is built on Three.js, which is Javascript 3D library helper for WebGL. With all that, we have been able to bring 3D into browsers.<\/p>\n<ul>\n<li>Type : 3D Website<\/li>\n<li>Technology : PHP, Java Scripts, CSS, Threejs, WebGL, 3D, CMS<\/li>\n<li>Features : 3D Animations, Boostrap framework, Control Panel<\/li>\n<\/ul>\n<h2>The Result<\/h2>\n<p>Celonic is very unique website and one of a kind project. The website is multilevel with different categories for each pentagon\/hexagon of the sphere, and each category have it&#8217;s own subcategory with different details and descriptions for every process. The website also have control panel for easier management in back-end which is built on laravel framework.<\/p>\n<ul>\n<li><a href=\"http:\/\/team4design.com\/celonic\/unfolding\/web\/\"><br \/>\nDemo with unfolding sphere<br \/>\n<\/a><\/li>\n<li><a href=\"http:\/\/team4design.com\/celonic\/hexagons\/web\/\" target=\"_blank\" rel=\"noopener\"><br \/>\nDemo with rotating sphere<br \/>\n<\/a><\/li>\n<\/ul>\n<p><a href=\"http:\/\/team4design.com\/new\/wp-content\/uploads\/2019\/01\/celonic_9-1.jpg\" data-elementor-open-lightbox=\"yes\" data-elementor-lightbox-title=\"celonic_9\"><br \/>\n<img loading=\"lazy\" src=\"https:\/\/team4design.com\/wp-content\/uploads\/2019\/01\/celonic_9-1-1024x518.jpg\" sizes=\"(max-width: 710px) 100vw, 710px\" srcset=\"https:\/\/team4design.com\/wp-content\/uploads\/2019\/01\/celonic_9-1-1024x518.jpg 1024w, https:\/\/team4design.com\/wp-content\/uploads\/2019\/01\/celonic_9-1-300x152.jpg 300w, https:\/\/team4design.com\/wp-content\/uploads\/2019\/01\/celonic_9-1-768x389.jpg 768w, https:\/\/team4design.com\/wp-content\/uploads\/2019\/01\/celonic_9-1.jpg 1920w\" alt=\"\" width=\"710\" height=\"359\" \/> <\/a><\/p>\n<p><strong>Year<\/strong><\/p>\n<p>Dec 2018<\/p>\n<p><strong>Type<\/strong><\/p>\n<p>3D Website<\/p>\n<p><strong>Client<\/strong><\/p>\n<p>Celonic AG<\/p>\n<p><strong>Links<\/strong><\/p>\n<p><a href=\"https:\/\/team4design.com\/celonic\/unfolding\/web\">Demo with unfolding sphere<\/a><br \/>\n<a href=\"https:\/\/team4design.com\/celonic\/hexagons\/web\/\">Demo with rotatnig sphere<\/a><\/p>\n","protected":false},"featured_media":920,"template":"","portfolio-cat":[18],"translation":{"provider":"WPGlobus","version":"2.7.5","language":"en","enabled_languages":["fr","de","en"],"languages":{"fr":{"title":true,"content":true,"excerpt":false},"de":{"title":true,"content":true,"excerpt":false},"en":{"title":true,"content":true,"excerpt":false}}},"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v16.4 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Celonic AG - Team 4 Design<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/team4design.com\/en\/portfolio\/celonic-ag-3d\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Celonic AG - Team 4 Design\" \/>\n<meta property=\"og:url\" content=\"https:\/\/team4design.com\/en\/portfolio\/celonic-ag-3d\/\" \/>\n<meta property=\"og:site_name\" content=\"Team 4 Design\" \/>\n<meta property=\"article:modified_time\" content=\"2021-08-18T16:28:45+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/team4design.com\/wp-content\/uploads\/2019\/02\/Celonic-Website.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1000\" \/>\n\t<meta property=\"og:image:height\" content=\"494\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https:\/\/team4design.com\/#organization\",\"name\":\"Team 4 Design\",\"url\":\"https:\/\/team4design.com\/\",\"sameAs\":[],\"logo\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/team4design.com\/#logo\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/team4design.com\/wp-content\/uploads\/2019\/02\/Team4Design-Logo-Courrier.png\",\"contentUrl\":\"https:\/\/team4design.com\/wp-content\/uploads\/2019\/02\/Team4Design-Logo-Courrier.png\",\"width\":300,\"height\":51,\"caption\":\"Team 4 Design\"},\"image\":{\"@id\":\"https:\/\/team4design.com\/#logo\"}},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/team4design.com\/#website\",\"url\":\"https:\/\/team4design.com\/\",\"name\":\"Team 4 Design\",\"description\":\"Web and graphic design\",\"publisher\":{\"@id\":\"https:\/\/team4design.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"https:\/\/team4design.com\/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/team4design.com\/en\/portfolio\/celonic-ag-3d\/#primaryimage\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/team4design.com\/wp-content\/uploads\/2019\/02\/Celonic-Website.png\",\"contentUrl\":\"https:\/\/team4design.com\/wp-content\/uploads\/2019\/02\/Celonic-Website.png\",\"width\":1000,\"height\":494},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/team4design.com\/en\/portfolio\/celonic-ag-3d\/#webpage\",\"url\":\"https:\/\/team4design.com\/en\/portfolio\/celonic-ag-3d\/\",\"name\":\"Celonic AG - Team 4 Design\",\"isPartOf\":{\"@id\":\"https:\/\/team4design.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/team4design.com\/en\/portfolio\/celonic-ag-3d\/#primaryimage\"},\"datePublished\":\"2019-01-09T14:01:15+00:00\",\"dateModified\":\"2021-08-18T16:28:45+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/team4design.com\/en\/portfolio\/celonic-ag-3d\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/team4design.com\/en\/portfolio\/celonic-ag-3d\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/team4design.com\/en\/portfolio\/celonic-ag-3d\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"item\":{\"@type\":\"WebPage\",\"@id\":\"https:\/\/team4design.com\/\",\"url\":\"https:\/\/team4design.com\/\",\"name\":\"Home\"}},{\"@type\":\"ListItem\",\"position\":2,\"item\":{\"@type\":\"WebPage\",\"@id\":\"https:\/\/team4design.com\/portfolios\/\",\"url\":\"https:\/\/team4design.com\/portfolios\/\",\"name\":\"Portfolios\"}},{\"@type\":\"ListItem\",\"position\":3,\"item\":{\"@id\":\"https:\/\/team4design.com\/en\/portfolio\/celonic-ag-3d\/#webpage\"}}]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","_links":{"self":[{"href":"https:\/\/team4design.com\/en\/wp-json\/wp\/v2\/portfolio\/342"}],"collection":[{"href":"https:\/\/team4design.com\/en\/wp-json\/wp\/v2\/portfolio"}],"about":[{"href":"https:\/\/team4design.com\/en\/wp-json\/wp\/v2\/types\/portfolio"}],"version-history":[{"count":127,"href":"https:\/\/team4design.com\/en\/wp-json\/wp\/v2\/portfolio\/342\/revisions"}],"predecessor-version":[{"id":2567,"href":"https:\/\/team4design.com\/en\/wp-json\/wp\/v2\/portfolio\/342\/revisions\/2567"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/team4design.com\/en\/wp-json\/wp\/v2\/media\/920"}],"wp:attachment":[{"href":"https:\/\/team4design.com\/en\/wp-json\/wp\/v2\/media?parent=342"}],"wp:term":[{"taxonomy":"portfolio-cat","embeddable":true,"href":"https:\/\/team4design.com\/en\/wp-json\/wp\/v2\/portfolio-cat?post=342"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}