{"id":3,"title":"【Tablet PC app】3D tattoo communication assistant app","subtitle":"An application with 3D workspace to significantly reduce the communication cost for tattoo artists and customers and increase customer satisfaction rates.","cover":"https://i.imgur.com/z2sKUNe.png","content":"\u003cdiv class=\"m-2 flex w-full flex-col\"\u003e\n   \u003cimg\n      src=\"https://raw.githubusercontent.com/robin-artemstein/robin-chen-case-study-3d-tattoo-commucation-assistant/main/3d-tattoo-commucation-assistant-app-main-image.png\"\n      width=\"1280\"\n      height=\"720\"\n      alt=\"Head image of 3D tattoo\"\n   /\u003e\n   \u003cdiv class=\"flex flex-wrap gap-4 p-2\"\u003e\n      \u003cdiv class=\"flex flex-col\"\u003e\n         \u003cdiv class=\"text-lg font-semibold text-amber-800\"\u003eMy role\u003c/div\u003e\n         \u003cdiv class=\"text-lg font-medium\"\u003e\n            Freelance product designer\u003cbr\u003eand UX developer\n         \u003c/div\u003e\n         \u003cdiv class=\"text-lg font-semibold text-amber-800\"\u003e\n            Project duration\n         \u003c/div\u003e\n         \u003cdiv class=\"text-lg font-medium\"\u003eApproximately 5 months\u003c/div\u003e\n      \u003c/div\u003e\n      \u003cdiv class=\"flex flex-col\"\u003e\n         \u003cdiv class=\"text-lg font-semibold text-amber-800\"\u003eWork with\u003c/div\u003e\n         \u003cdiv class=\"text-lg font-medium\"\u003e1 back end developer\u003c/div\u003e\n         \u003cdiv class=\"text-lg font-medium\"\u003e1 product manager\u003c/div\u003e\n      \u003c/div\u003e\n      \u003cdiv class=\"flex flex-col\"\u003e\n         \u003cdiv class=\"text-lg font-semibold text-amber-800\"\u003eTech stack\u003c/div\u003e\n         \u003cdiv class=\"text-lg font-medium\"\u003eDraw.io\u003c/div\u003e\n         \u003cdiv class=\"text-lg font-medium\"\u003eFigma\u003c/div\u003e\n         \u003cdiv class=\"text-lg font-medium\"\u003eBlender\u003c/div\u003e\n         \u003cdiv class=\"text-lg font-medium\"\u003eReact\u003c/div\u003e\n         \u003cdiv class=\"text-lg font-medium\"\u003eTypeScript\u003c/div\u003e\n         \u003cdiv class=\"text-lg font-medium\"\u003eUnity WebGL\u003c/div\u003e\n         \u003cdiv class=\"text-lg font-medium\"\u003eC#\u003c/div\u003e\n         \u003cdiv class=\"text-lg font-medium\"\u003eGitHub\u003c/div\u003e\n      \u003c/div\u003e\n   \u003c/div\u003e\n   \u003cdiv class=\"flex flex-col\"\u003e\n      \u003cdiv class=\"py-2 text-2xl font-bold text-amber-800\"\u003eOverview\u003c/div\u003e\n      \u003cdiv class=\"text-lg font-medium\"\u003e\n         The client is a physical tattoo studio which is founded by 5\n         experienced female tattoo artists, they are passionated and good t\n         black and gray scale tattoo. They need a integrated solution which aims\n         to reduct the commucation cost for tattoo artists and customers.\n      \u003c/div\u003e\n      \u003cdiv class=\"py-2 text-2xl font-bold text-amber-800\"\u003e\n         Outcome and impact\n      \u003c/div\u003e\n      \u003cdiv class=\"flex flex-wrap gap-1\"\u003e\n         \u003cdiv class=\"flex flex-col gap-1 p-4\"\u003e\n            \u003cdiv class=\"text-2xl font-semibold\"\u003e＞ 70%\u003c/div\u003e\n            \u003cdiv class=\"text-lg font-medium\"\u003eof customers fell satisfied.\u003c/div\u003e\n         \u003c/div\u003e\n         \u003cdiv class=\"flex flex-col gap-1 p-4\"\u003e\n            \u003cdiv class=\"text-2xl font-semibold\"\u003e－ 60%\u003c/div\u003e\n            \u003cdiv class=\"text-lg font-medium\"\u003e\n               Commucation cost\n               \u003cbr\u003e\n               for tattoo artists and customers\n            \u003c/div\u003e\n         \u003c/div\u003e\n         \u003cdiv class=\"flex flex-col gap-1 p-4\"\u003e\n            \u003cdiv class=\"text-2xl font-semibold\"\u003e－ 97%\u003c/div\u003e\n            \u003cdiv class=\"text-lg font-medium\"\u003e\n               Customer complaint rates\n               \u003cbr\u003e\n               and consumer disputes\n            \u003c/div\u003e\n         \u003c/div\u003e\n      \u003c/div\u003e\n      \u003cdiv class=\"py-2 text-2xl font-bold text-amber-800\"\u003e\n         Problem and challenge\n      \u003c/div\u003e\n      \u003cdiv class=\"text-lg font-medium\"\u003e\n         \u003cul class=\"mx-8 list-disc\"\u003e\n            \u003cli\u003e\n               Tattoos are generally irreversible, the cost of removal is pretty\n               high, and it is not possible to be fully restored, so\n               communicating with clients is extremely crucial.\n            \u003c/li\u003e\n            \u003cli\u003e\n               Even though there are many tattoo-related applications in app\n               stores, however, the biggest problem is that most of them only\n               represent details with 2D photos.\n            \u003c/li\u003e\n            \u003cli\u003e\n               The increasing cost of communication between tatoo artists and\n               customers is leading to a lack of trust between them.\n            \u003c/li\u003e\n         \u003c/ul\u003e\n      \u003c/div\u003e\n      \u003cdiv class=\"m-4 py-2\"\u003e\u003c/div\u003e\n      \u003cdiv class=\"w-full\"\u003e\n         \u003cdiv class=\"py-2 text-2xl font-bold\"\u003eMy approach\u003c/div\u003e\n         \u003cdiv\u003e\n            \u003cul class=\"mx-8 list-disc\"\u003e\n               \u003cli\u003e\n                  \u003ca\n                     class=\"font-semibold text-amber-800 transition duration-500 ease-in-out\"\n                     href=\"#sol-1\"\n                     \u003eRequirements definition\n                  \u003c/a\u003e\n               \u003c/li\u003e\n               \u003cli\u003e\n                  \u003ca\n                     class=\"font-semibold text-amber-800 transition duration-500 ease-in-out\"\n                     href=\"#sol-2\"\n                     \u003eUnified Android tablet PC hardware and an application\u003c/a\n                  \u003e\n               \u003c/li\u003e\n               \u003cli\u003e\n                  \u003ca\n                     class=\"font-semibold text-amber-800 transition duration-500 ease-in-out\"\n                     href=\"#sol-3\"\n                     \u003eFully interactive 3D workspace\u003c/a\n                  \u003e\n               \u003c/li\u003e\n               \u003cli\u003e\n                  \u003ca\n                     class=\"font-semibold text-amber-800 transition duration-500 ease-in-out\"\n                     href=\"#sol-4\"\n                     \u003eAgreement management\u003c/a\n                  \u003e\n               \u003c/li\u003e\n            \u003c/ul\u003e\n         \u003c/div\u003e\n      \u003c/div\u003e\n      \u003cdiv class=\"m-4 py-2\"\u003e\u003c/div\u003e\n      \u003cdiv id=\"sol-1\" class=\"py-2 text-2xl font-bold text-amber-800\"\u003e\n         Requirements definition\n      \u003c/div\u003e\n      \u003cdiv class=\"text-lg font-medium\"\u003e\n         In order to ensure that the application meet the requirement, I\n         conducted a remote user interview on Zoom, I invited 5 customers and 5\n         tattoo artists in the interview session, gather insights from them.\n      \u003c/div\u003e\n      \u003cdiv class=\"py-2\"\u003e\u003c/div\u003e\n      \u003cdiv class=\"text-lg font-medium\"\u003e\n         In order to ensure that the application meet the requirement, I worked\n         closely with product maanger to conduct a remote user interview on\n         Zoom, we invited 5 customers and 5 tattoo artists in the interview\n         session, gather insights from them.\n      \u003c/div\u003e\n      \u003cdiv class=\"py-2\"\u003e\u003c/div\u003e\n      \u003cdiv class=\"text-lg font-medium\"\u003e\n         We crafted personas for customers and tattoo artists, we can prioritize\n         what we should do in the initial release, formulated the implementation\n         plans and direction according to these personas.\n      \u003c/div\u003e\n      \u003cdiv class=\"py-2\"\u003e\u003c/div\u003e\n      \u003cdiv class=\"flex flex-row\"\u003e\n         \u003cdiv\u003e\n            \u003cimg\n               src=\"https://raw.githubusercontent.com/robin-artemstein/robin-chen-case-study-3d-tattoo-commucation-assistant/main/3d-tattoo-commucation-assistant-app-tattoo-artist-persona.png\"\n               width=\"500\"\n               height=\"525\"\n               alt=\"Tattoo artist persona\"\n            /\u003e\n         \u003c/div\u003e\n         \u003cdiv\u003e\n            \u003cimg\n               src=\"https://raw.githubusercontent.com/robin-artemstein/robin-chen-case-study-3d-tattoo-commucation-assistant/main/3d-tattoo-commucation-assistant-app-customer-persona.png\"\n               width=\"500\"\n               height=\"525\"\n               alt=\"Customer persona\"\n            /\u003e\n         \u003c/div\u003e\n      \u003c/div\u003e\n      \u003cdiv class=\"m-4 py-2\"\u003e\u003c/div\u003e\n      \u003cdiv id=\"sol-2\" class=\"py-2 text-2xl font-bold text-amber-800\"\u003e\n         Unified Android tablet PC hardwares and an application\n      \u003c/div\u003e\n      \u003cdiv class=\"text-lg font-medium\"\u003e\n         According to client's requirements, my first propose is unified\n         hardware and an application for tattoo artists.\n      \u003c/div\u003e\n      \u003cdiv class=\"py-2\"\u003e\u003c/div\u003e\n      \u003cdiv class=\"text-lg font-medium\"\u003e\n         After couple times of comparasion, I and tattoo artists had unanimously\n         decided to pick Samsung Galaxy Tab, which come with a dedicated\n         battery-free digitizer, because tattoo artists need precise control in\n         the application.\n      \u003c/div\u003e\n      \u003cdiv class=\"py-2\"\u003e\u003c/div\u003e\n      \u003cdiv class=\"text-lg font-medium\"\u003e\n         I had talked with tattoo artists after the application was launched,\n         all of them agreed with this approach and they think it is pretty\n         helpful for their work in the future.\n      \u003c/div\u003e\n      \u003cdiv class=\"py-2\"\u003e\u003c/div\u003e\n      \u003cdiv\u003e\n         \u003cimg\n            src=\"https://raw.githubusercontent.com/robin-artemstein/robin-chen-case-study-3d-tattoo-commucation-assistant/main/3d-tattoo-commucation-assistant-app-unified-hardware.png\"\n            width=\"1280\"\n            height=\"720\"\n            alt=\"Head image of 3D tattoo\"\n         /\u003e\n      \u003c/div\u003e\n      \u003cdiv class=\"m-4 py-2\"\u003e\u003c/div\u003e\n      \u003cdiv id=\"sol-3\" class=\"py-2 text-2xl font-bold text-amber-800\"\u003e\n         Fully interactive 3D workspace\n      \u003c/div\u003e\n      \u003cdiv class=\"text-lg font-medium\"\u003e\n         With this design, tattoo artists can rotate the 3d model 360 degrees,\n         and add multiple tattoo image projectors in the workspace, they can\n         also move, scale, rotate, and set the visibility of these projectors.\n         Tattoo artists can replace the defalt tattoo image by uploading what\n         they need from local machine,\n      \u003c/div\u003e\n      \u003cdiv class=\"py-2\"\u003e\u003c/div\u003e\n      \u003cdiv class=\"text-lg font-medium\"\u003e\n         Tattoo artists can show the screen to customers while they are working\n         on it, customers can preview the result and tell artists if this is\n         what they want.\n      \u003c/div\u003e\n      \u003cdiv class=\"py-2\"\u003e\u003c/div\u003e\n      \u003cdiv class=\"text-lg font-medium\"\u003e\n         I had do a research for a month when the initial release version was\n         launched, all of tatoo artists and more than 70% of customers are think\n         this innovative design can surely save a lot of time on communicating.\n      \u003c/div\u003e\n      \u003cdiv class=\"py-2\"\u003e\u003c/div\u003e\n      \u003cdiv\u003e\n         \u003cvideo\n            style=\"pointer-events: none\"\n            autoplay\n            loop\n            muted\n            playsinline\n            width=\"1270\"\n            height=\"595\"\n         \u003e\n            \u003csource\n               src=\"https://raw.githubusercontent.com/robin-artemstein/robin-chen-case-study-3d-tattoo-commucation-assistant/main/3d-tattoo-commucation-assistant-app-full-3d-workspace-2.mp4\"\n               type=\"video/mp4\"\n            /\u003e\n         \u003c/video\u003e\n      \u003c/div\u003e\n      \u003cdiv class=\"m-4 py-2\"\u003e\u003c/div\u003e\n      \u003cdiv id=\"sol-4\" class=\"py-2 text-2xl font-bold text-amber-800\"\u003e\n         Agreement management\n      \u003c/div\u003e\n      \u003cdiv class=\"text-lg font-medium\"\u003e\n         After several communication, if both of tattoo artists and customers\n         reach consensus, then a written agreement is a must.\n      \u003c/div\u003e\n      \u003cdiv class=\"py-2\"\u003e\u003c/div\u003e\n      \u003cdiv class=\"text-lg font-medium\"\u003e\n         Tattoo artists can update agreement terms and have the names of both\n         party signed with full communication with customers, then tattoo\n         artists can save the signature on their cloud and print them on the\n         paper for customers to reserve.\n      \u003c/div\u003e\n      \u003cdiv class=\"py-2\"\u003e\u003c/div\u003e\n      \u003cdiv\u003e\n         \u003cimg\n            src=\"https://raw.githubusercontent.com/robin-artemstein/robin-chen-case-study-3d-tattoo-commucation-assistant/main/3d-tattoo-commucation-assistant-app-agreement-management.png\"\n            width=\"1280\"\n            height=\"720\"\n            alt=\"Agreement management\"\n         /\u003e\n      \u003c/div\u003e\n          \u003cdiv class=\"m-4 py-2\"\u003e\u003c/div\u003e\n    \u003cdiv class=\"m-4 py-2\"\u003e\u003c/div\u003e\n    \u003cdiv class=\"w-full\"\u003e\n        \u003chr class=\"border-1 border-dashed\" /\u003e\n    \u003c/div\u003e\n    \u003cdiv class=\"m-4 py-2\"\u003e\u003c/div\u003e\n    \u003cdiv class=\"text-2xl font-semibold\"\u003eIf you are interested in how my designs drive business growth.\u003c/div\u003e\n    \u003cdiv class=\"py-2\"\u003e\u003c/div\u003e\n    \u003cdiv class=\"text-2xl font-semibold\"\u003eTap the button below, let's talk about your project.\u003c/div\u003e\n   \u003c/div\u003e\n\u003c/div\u003e","slug":"3d-tattoo-communication-assistant-app","featured":"true","visible":"true","demo":"https://eclectic-mousse-fc8386.netlify.app"}