<!DOCTYPE html>
<html lang="en-gb" dir="ltr" xmlns: og = "http://ogp.me/ns#">

	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="theme-color" content="#195eaa">
	<meta name="msapplication-config" content="media/templates/site/danielcktan/favicon/browserconfig.xml">
	<meta name="msapplication-TileColor" content="#195eaa">
	<meta name="pinterest" content="nopin">
	<title>Home - Portfolio of Daniel C K Tan</title>
	<link href="/?format=feed&amp;type=rss" rel="alternate" type="application/rss+xml" title="RSS 2.0">
	<link href="/?format=feed&amp;type=atom" rel="alternate" type="application/atom+xml" title="Atom 1.0">
	<link href="/media/templates/site/danielcktan/favicon/apple-touch-icon.png" rel="apple-touch-icon" sizes="180x180">
	<link href="/media/templates/site/danielcktan/favicon/favicon-32x32.png" rel="icon" sizes="32x32" type="image/png">
	<link href="/media/templates/site/danielcktan/favicon/favicon-16x16.png" rel="icon" sizes="16x16" type="image/png">
	<link href="/media/templates/site/danielcktan/favicon/safari-pinned-tab.svg" rel="mask-icon" color="#195eaa">
	<link href="/media/templates/site/danielcktan/favicon/site.webmanifest.json" rel="manifest">
	<link href="/media/templates/site/danielcktan/favicon/favicon.ico" rel="shortcut icon">
	<link href="/humans.txt" rel="author" type="text/plain">

	<link href="https://cdn.jsdelivr.net/npm/bootstrap@5/dist/css/bootstrap.min.css?e122b002b433ddb91d4cbe501ab18a7e" rel="stylesheet" />
	<link href="https://cdn.jsdelivr.net/npm/magnific-popup@1/dist/magnific-popup.min.css?e122b002b433ddb91d4cbe501ab18a7e" rel="stylesheet" />
	<link href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6/css/all.min.css?e122b002b433ddb91d4cbe501ab18a7e" rel="stylesheet" />
	<link href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6/css/v4-shims.min.css?e122b002b433ddb91d4cbe501ab18a7e" rel="stylesheet" />
	<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1/font/bootstrap-icons.css?e122b002b433ddb91d4cbe501ab18a7e" rel="stylesheet" />
	<link href="https://cdn.jsdelivr.net/npm/aos@2/dist/aos.css?e122b002b433ddb91d4cbe501ab18a7e" rel="stylesheet" />
	<link href="/media/templates/site/danielcktan/css/template.css?e122b002b433ddb91d4cbe501ab18a7e" rel="stylesheet" />
	<link href="/media/templates/site/danielcktan/css/user.css?e122b002b433ddb91d4cbe501ab18a7e" rel="stylesheet" />
	<link href="/media/templates/site/danielcktan/css/fonts/fonts-user_template.css?e122b002b433ddb91d4cbe501ab18a7e" rel="stylesheet" />
	<style nonce="ZWU4NmQwZTVhODc1NzMyNTM1OWUyZjExZjk4Y2Y3YjI0Mjg0MzFmMmQ4MTM2Y2Y3MDVhNzVhNWUyNGFmZWJlZjBkMDhkZjk0YWRiZjFjNWQ1ZWNhMDFhMWIzMTRiNDY2MjM0Yjc3ZDQ0MWZjZTY3M2EwNTVmOTkwY2RlZDI1NTg=">
	:root {
		/* BRAND LOGO */
		--base-col-primary				: #195eaa;
		--base-col-primary-light		: #0099cc;
		--base-col-primary-dark			: #003366;
		--base-col-primary-darker		: #032747;
		--base-col-secondary			: #0891b2;
		--base-col-body-background		: #ffffff;
		--base-col-body-text			: #333333;
		--base-col-link					: #666666;
		--base-col-link-hover			: #666666;
	}
	
	@media (max-width: 1024px) {
		#mainNav .navbar-brand img { content: url(images/logo-sm.png#joomlaImage://local-images/logo-sm.png?width=150&height=55) !important; }
	}
	
	#mainNav.navbar-scrolled .navbar-brand img { width: 160px !important; content: url(images/logo-sm.png#joomlaImage://local-images/logo-sm.png?width=150&height=55) !important; }
	
	
	
	</style>

	<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js?e122b002b433ddb91d4cbe501ab18a7e"></script>
	<script src="https://cdn.jsdelivr.net/npm/js-cookie@3/dist/js.cookie.min.js?e122b002b433ddb91d4cbe501ab18a7e"></script>
	<script src="https://cdn.jsdelivr.net/npm/jquery@3/dist/jquery.min.js?e122b002b433ddb91d4cbe501ab18a7e"></script>
	<script src="https://cdn.jsdelivr.net/npm/magnific-popup@1/dist/jquery.magnific-popup.min.js?e122b002b433ddb91d4cbe501ab18a7e"></script>
	<script src="https://cdn.jsdelivr.net/npm/jquery.easing@1/jquery.easing.min.js?e122b002b433ddb91d4cbe501ab18a7e"></script>
	<script src="https://cdn.jsdelivr.net/npm/aos@2/dist/aos.js?e122b002b433ddb91d4cbe501ab18a7e"></script>
	<script src="/media/templates/site/danielcktan/js/template.js?e122b002b433ddb91d4cbe501ab18a7e"></script>
	<script src="/media/templates/site/danielcktan/js/user.js?e122b002b433ddb91d4cbe501ab18a7e"></script>
	<meta property="og:title" content="Home - Portfolio of Daniel C K Tan">
	<meta property="og:site_name" content="Portfolio of Daniel C K Tan">
	<meta property="og:description" content="">
	<meta property="og:image" content="/media/templates/site/danielcktan/images/og-img.png">
	<meta property="og:type" content="website">
	<meta property="og:url" content="https://www.danielcktan.sg/index.php">
	<base href="/">

	
	</head>
	
	<body itemscope 
    	  itemtype="http://schema.org/WebPage"
    	  id="page-top"
    	  class=""
		  data-bs-spy="scroll" data-bs-target="#mainNavMenu" data-bs-offset="72">
		
		<nav itemscope 
		 itemtype="http://schema.org/WPHeader"
		 id="mainNav" 
		 class="navbar navbar-expand-xl navbar-light  fixed-top">
		<div class="container">
			<a class="navbar-brand" href="/">
				<img class="logo align-middle" src="/images/logo.png#joomlaImage://local-images/logo.png?width=220&amp;height=81" alt="Portfolio of Daniel C K Tan">			</a>
			
						<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#mainNavMenu" aria-controls="mainNavMenu" aria-expanded="false" aria-label="Toggle navigation">Menu <i class="fa fa-fw fa-bars"></i></button>
			
			<div itemscope 
				 itemtype="http://schema.org/SiteNavigationElement"
				 id="mainNavMenu"
				 class="collapse navbar-collapse">
				 <ul class="navbar-nav ms-auto mb-2 mb-lg-0 ">
<li class="nav-item item-101 default current active"><a class='nav-link  active ' href='/' > Home </a></li><li class="nav-item item-154"><a class='nav-link  ' href='#about' > About </a></li><li class="nav-item item-155"><a class='nav-link  ' href='#projects' > Projects </a></li><li class="nav-item item-156"><a class='nav-link  ' href='#experiences' > Experiences </a></li><li class="nav-item item-157"><a class='nav-link  ' href='#contact' > Contact </a></li></ul>

			</div>
					</div>
				<div class="scroll-progress">
			<div class="page-scroll-progress">
				<div id="scrollProgressBar" class="page-scroll-progress-bar"></div>
			</div>
		</div>
			</nav>
	
	
			    
				

<section class="section section-bkg" id="intro" style="height: 100vh;">
<div class="container h-100">
<div class="row h-100 align-items-center justify-content-center" data-aos="fade-down">
<div class="col-md-10">
<div class="greetings"><span>Hello</span></div>
<h3>I am <span class="name">Daniel</span>  Tan</h3>
<h1>
<span class="typewrite" data-period="2000" data-type='["eLearning Designer", "Web Designer", "UI Designer", "Graphic Designer", "IT Trainer"]'><span class="wrap"></span></span>
</h1>
<!--
<h1 class="typewrite" data-period="2000" data-type="[ 'eLearning Designer', 'Web Designer', 'UI Designer', 'Graphic Designer', 'IT Trainer']">
    <span class="wrap"></span>
</h1>
-->
<!--
<h1 class="cd-headline slide"><span class="cd-words-wrapper"> <b class="is-visible"><span class="text-lowercase">e</span>Learning Designer</b> <b>Web Designer</b> <b>Graphic Designer</b> <b>UI Designer</b> <b>IT Trainer</b> </span></h1>
-->
<p><a href="#portfolio" class="btn btn-lg btn-success page-scroll">View Portfolio <i class="fa-solid fa-arrow-right"></i></a></p>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="jumper text-center"><a href="#about" class="page-scroll"><i class="fa-solid fa-chevron-down animated bounce infinite"></i></a></div>
</div>
</div>
</div>
</section>
			
				
				

<section class="section section-bkg" id="about">
<div class="container">

<div class="row">
<div class="col-md-9" data-aos="fade-up">
<h4>I provide:</h4>
<h2 class="cd-headline slide"><span class="cd-words-wrapper"> <b class="is-visible">Elegant Design</b> <b>Functional Solutions</b> <b>Readable Codes</b> </span></h2>
</div>
</div>

<div class="row mb-5">
<div class="col-sm-9" data-aos="fade-up">
<p class="text-justify">I am passionate about applying my instructional design knowledge to design and develop engaging online eLearning coursewares. Nothing satisfies me more than seeing the online courses meeting the learning needs of the learners. I also enjoy building responsive &amp; mobile-friendly websites with functional user interfaces that deliver positive user experiences.</p>
</div>
</div>

<div class="row">
<div class="col-sm-9">
<div class="row">
<div class="col-md-4" data-aos="fade-up">
<div class="box">
<div class="icon"><i class="fa-solid fa-laptop-file"></i></div>
<h4 class="title">eLearning Design</h4>
<p class="description"> </p>
</div>
</div>
<div class="col-md-4" data-aos="fade-up">
<div class="box">
<div class="icon"><i class="fa-solid fa-code"></i></div>
<h4 class="title">Responsive Web Design</h4>
<p class="description"> </p>
</div>
</div>
<div class="col-md-4" data-aos="fade-up">
<div class="box">
<div class="icon"><i class="fa-solid fa-columns"></i></div>
<h4 class="title">UI/UX Design</h4>
<p class="description"> </p>
</div>
</div>
</div>
<div class="row">
<div class="col-md-4" data-aos="fade-up">
<div class="box">
<div class="icon"><i class="fa-solid fa-image"></i></div>
<h4 class="title">Graphic Design</h4>
<p class="description"> </p>
</div>
</div>
<div class="col-md-4" data-aos="fade-up">
<div class="box">
<div class="icon"><i class="fa-solid fa-shopping-cart"></i></div>
<h4 class="title">eCommerce, CMS &amp; LMS</h4>
<p class="description"> </p>
</div>
</div>
<div class="col-md-4" data-aos="fade-up">
<div class="box">
<div class="icon"><i class="fa-solid fa-square-share-nodes"></i></div>
<h4 class="title">SEO &amp; Social Media</h4>
<p class="description"> </p>
</div>
</div>
</div>
</div>
</div>

</div>
</section>
			
				

<section class="section section-bkg" id="projects">
<div class="container h-100">
<div class="row h-100 align-items-center justify-content-center">
<div class="col-md-7"> </div>
<div class="col-md-5">
<h2 class="textShadow">Latest Project</h2>
<h4 class="textShadow">what's keeping me busy...</h4>
</div>
</div>
</div>
</section>
			
				

<section class="section" id="portfolio">
<div class="container">
<div class="row">
	<div class="col-md-12">
		<h2 class="section-title">Portfolio</h2>
	</div>
</div>
<div class="row margin-top-40">
	<div class="col-md-12">
		<ul id="portfolio-flters">
			<li class="filter-active" data-filter=".filter-web, .filter-graphic, .filter-elearning">All</li>
			<li data-filter=".filter-web">Web</li>
			<li data-filter=".filter-graphic">Graphic</li>
			<!--<li data-filter=".filter-elearning">elearning</li>-->
		</ul>
	</div>
</div>
<div id="portfolio-wrapper" class="row">
	<div class="col-lg-4 col-md-6 portfolio-item filter-web">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/portfolio-showcase-aem2021.jpg" title="Autism Enabling Masterplan (2021)" class="lightbox"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-aem2021.jpg" border="0" alt="Autism Enabling Masterplan (2021)" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">Autism Enabling Masterplan (2021)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Web Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-web">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/portfolio-showcase-profbrawn2020.jpg" title="Professor Brawn Cafe (2020)" class="lightbox"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-profbrawn2020.jpg" border="0" alt="Professor Brawn Cafe (2020)" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">Professor Brawn Cafe (2020)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Web Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-web">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/portfolio-showcase-annualreport20182019.jpg" title="ARC(S) Annual Report (2018 - 2019)" class="lightbox"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-annualreport20182019.jpg" border="0" alt="ARC(S) Annual Report (2018 - 2019)" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">ARC(S) Annual Report (2018 - 2019)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Web Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-web">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/portfolio-showcase-apac2019.jpg" title="APAC (2019)" class="lightbox"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-apac2019.jpg" border="0" alt="APAC (2019)" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">APAC (2019)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Web Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-web">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/portfolio-showcase-ktplib.jpg" title="ARC(S) Library - SPYDUS Catalogue (2018)" class="lightbox"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-ktplib.jpg" border="0" alt="ARC(S) Library (2018)" /> </a></div>
			<div class="details">
				<h4 class="portfolio-item-title">ARC(S) Library (2018)</h4>
				<div class="portfolio-item-meta"><span class="portfolio-item-category">Web Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-web">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/portfolio-showcase-profbrawn.jpg" title="Prof Brawn Cafe (2018)" class="lightbox"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-profbrawn.jpg" border="0" alt="Prof Brawn Cafe" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">Prof Brawn Cafe (2018)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Web Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-web">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/portfolio-showcase-learnforlife2017.jpg" title="Learn for Life eCampus (2017)" class="lightbox"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-learnforlife2017.jpg" border="0" alt="Learn for Life eCampus (2017)" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">Learn for Life eCampus (2017)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Web Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-web">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/portfolio-showcase-afa2017.jpg" title="Art for Autism (2017)" class="lightbox"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-afa2017.jpg" border="0" alt="Art for Autism (2017)" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">Art for Autism (2017)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Web Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-graphic">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/portfolio-showcase-perspectives-201705.jpg" title="Perspectives (2017)" class="lightbox"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-perspectives-201705.jpg" border="0" alt="Perspectives (2017)" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">Perspectives (2017)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Print Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-graphic">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/portfolio-showcase-eip-brochure-201601.jpg" title="EIP Brochure (2016)" class="lightbox"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-eip-brochure-201601.jpg" border="0" alt="EIP Brochure (2016)" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">EIP Brochure (2016)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Print Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-web">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/portfolio-showcase-afa2015.jpg" title="Art for Autism (2015)" class="lightbox"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-afa2015.jpg" border="0" alt="Art for Autism (2015)" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">Art for Autism (2015)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Web Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-web">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/portfolio-showcase-arc.jpg" title="Autism Resource Centre (S) (2015)" class="lightbox"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-arc.jpg" border="0" alt="Autism Resource Centre (S) (2015)" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">ARC(S) (2015)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Web Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-web">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/portfolio-showcase-pathlight.jpg" title="Pathlight School (2014)" class="lightbox"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-pathlight.jpg" border="0" alt="Pathlight School (2014)" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">Pathlight School (2014)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Web Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-web">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/portfolio-showcase-yfa.jpg" title="Youths for Autism (2014)" class="lightbox"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-yfa.jpg" border="0" alt="Youths for Autism (2014)" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">Youths for Autism (2014)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Web Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-graphic">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/Print-TMC-International-Pathways-2013-03.pdf" title="TMC International Pathways (2013)" class="lightbox-iframe"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-tmc-pathways-201303.jpg" border="0" alt="TMC International Pathways (2013)" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">TMC Intl. Pathways (2013)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Print Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-graphic">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/portfolio-showcase-tmc-chinese-201301.jpg" title="TMC Certificate in Elementary Chinese (2013)" class="lightbox"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-tmc-chinese-201301.jpg" border="0" alt="TMC Certificate in Elementary Chinese (2013)" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">TMC CEC (2013)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Print Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-graphic">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a rel="noopener" href="/images/portfolio/Print-TMC-ISP-2013-201212.pdf" target="_blank" title="TMC International Student Prospectus 2013 (2012)" class="lightbox-iframe"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-tmc-isp-201212.jpg" border="0" alt="TMC International Student Prospectus 2013 (2012)" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">TMC ISP 2013 (2012)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Print Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-graphic">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/portfolio-showcase-ljmu-ssp-201207.jpg" title="TMC-LJMU Summer Semester Programme (2012)" class="lightbox"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-ljmu-ssp-201207.jpg" border="0" alt="TMC-LJMU Summer Semester Programme (2012)" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">TMC-LJMU SSP (2012)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Print Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-graphic">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/portfolio-showcase-uniglo-agent-201203.jpg" title="University of Glouchestershire Agent Flyer (2012)" class="lightbox"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-uniglo-agent-201203.jpg" border="0" alt="University of Glouchestershire Agent Flyer (2012)" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">UniGlou Agent Flyer (2012)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Print Design</span></div>
			</div>
		</div>
	</div>
	<div class="col-lg-4 col-md-6 portfolio-item filter-graphic">
		<div class="portfolio-item-inner">
			<div class="portfolio-img"><a href="/images/portfolio/portfolio-showcase-education-uk-exhibition-201203.jpg" title="Education UK Exhibition (2012)" class="lightbox"> <img class="img-fluid" src="/images/portfolio/portfolio-thumb-education-uk-exhibition-201203.jpg" border="0" alt="Education UK Exhibition (2012)" /> </a></div>
			<div class="details">
			<h4 class="portfolio-item-title">Education UK Exhibition (2012)</h4>
			<div class="portfolio-item-meta"><span class="portfolio-item-category">Print Design</span></div>
			</div>
		</div>
	</div>
</div>
</div>
</section>
			
				

<section id="experiences" class="section">
<div class="container">
<div class="row">
<div class="col-md-12">
<h2 class="section-title">Experiences</h2>
</div>
</div>
<div class="row mt-5">
<div class="col-md-12">

<ul class="timeline">

<li class="timeline">
<div class="timeline-badge">
<i class="fa-solid fa-briefcase"></i>
</div>
<div class="timeline-panel" data-aos="fade-up">
<div class="timeline-heading">
<h4>Pathlight School / Autism Resource Centre (S)</h4>
<h5>Senior Specialist (Digital Learning &amp; Web Design</h5>
</div>
<div class="timeline-body">
<p>&nbsp;</p>
</div>
<div class="timeline-footer">
<p class="text-right"><i class="far fa-fw fa-calendar-alt"></i> Aug 2013 - PRESENT</p>
</div>
</div>
</li>

<li class="timeline-inverted">
<div class="timeline-badge">
<i class="fa-solid fa-graduation-cap"></i>
</div>
<div class="timeline-panel" data-aos="fade-up">
<div class="timeline-heading">
<h4>HFI UX 1 Usability Engineering Course</h4>
<h5>NTUC LearningHub</h5>
</div>
<div class="timeline-body">
<p>&nbsp;</p>
</div>
<div class="timeline-footer">
<p class="text-right"><i class="far fa-fw fa-calendar-alt"></i> Jan 2021</p>
</div>
</div>
</li>

<li class="timeline-inverted">
<div class="timeline-badge">
<i class="fa-solid fa-graduation-cap"></i>
</div>
<div class="timeline-panel" data-aos="fade-up">
<div class="timeline-heading">
<h4>Certificate in Autism (CIA)</h4>
<h5>Autism Resource Centre (S)</h5>
</div>
<div class="timeline-body">
<p>&nbsp;</p>
</div>
<div class="timeline-footer">
<p class="text-right"><i class="far fa-fw fa-calendar-alt"></i> Feb 2015 - May 2015</p>
</div>
</div>
</li>

<li class="timeline-inverted">
<div class="timeline-badge">
<i class="fa-solid fa-graduation-cap"></i>
</div>
<div class="timeline-panel" data-aos="fade-up">
<div class="timeline-heading">
<h4>Advance Certificate in Training and Assessment (ACTA)</h4>
<h5>Institute of Adult Learning</h5>
</div>
<div class="timeline-body">
<p>&nbsp;</p>
</div>
<div class="timeline-footer">
<p class="text-right"><i class="far fa-fw fa-calendar-alt"></i> Jul 2014 - Sep 2014</p>
</div>
</div>
</li> 

<li class="timeline-inverted">
<div class="timeline-badge">
<i class="fa-solid fa-graduation-cap"></i>
</div>
<div class="timeline-panel" data-aos="fade-up">
<div class="timeline-heading">
<h4>Diploma (Conversion) in Digital Advertising Technology and Analytics</h4>
<h5>Temasek Polytechnic</h5>
</div>
<div class="timeline-body">
<p>&nbsp;</p>
</div>
<div class="timeline-footer">
<p class="text-right"><i class="far fa-fw fa-calendar-alt"></i> Jan 2014 - May 2014</p>
</div>
</div>
</li> 

<li class="timeline-inverted">
<div class="timeline-badge">
<i class="fa-solid fa-graduation-cap"></i>
</div>
<div class="timeline-panel" data-aos="fade-up">
<div class="timeline-heading">
<h4>Fundamentals of Autism (FOA)</h4>
<h5>Autism Resource Centre (S)</h5>
</div>
<div class="timeline-body">
<p>&nbsp;</p>
</div>
<div class="timeline-footer">
<p class="text-right"><i class="far fa-fw fa-calendar-alt"></i> Sep 2013</p>
</div>
</div>
</li> 

<li class="timeline">
<div class="timeline-badge">
<i class="fa-solid fa-briefcase"></i>
</div>
<div class="timeline-panel" data-aos="fade-up">
<div class="timeline-heading">
<h4>TMC Academy</h4>
<h5>Web Designer</h5>
</div>
<div class="timeline-body">
<p>&nbsp;</p>
</div>
<div class="timeline-footer">
<p class="text-right"><i class="far fa-fw fa-calendar-alt"></i> Mar 2012 - Aug 2013</p>
</div>
</div>
</li>


<li class="timeline">
<div class="timeline-badge">
<i class="fa-solid fa-briefcase"></i>
</div>
<div class="timeline-panel" data-aos="fade-up">
<div class="timeline-heading">
<h4>Wizlearn Technologies</h4>
<h5>Web UI Designer</h5>
</div>
<div class="timeline-body">
<p>&nbsp;</p>
</div>
<div class="timeline-footer">
<p class="text-right"><i class="far fa-fw fa-calendar-alt"></i> Jan 2011 - Feb 2012</p>
</div>
</div>
</li>

<li class="timeline">
<div class="timeline-badge">
<i class="fa-solid fa-briefcase"></i>
</div>
<div class="timeline-panel" data-aos="fade-up">
<div class="timeline-heading">
<h4>Wizlearn Technologies</h4>
<h5>ICT Executive / Trainer</h5>
</div>
<div class="timeline-body">
<p>&nbsp;</p>
</div>
<div class="timeline-footer">
<p class="text-right"><i class="far fa-fw fa-calendar-alt"></i> Oct 2008 - Dec 2010</p>
</div>
</div>
</li>

<li class="timeline-inverted">
<div class="timeline-badge">
<i class="fa-solid fa-graduation-cap"></i>
</div>
<div class="timeline-panel" data-aos="fade-up">
<div class="timeline-heading">
<h4>Bachelor in Media Arts</h4>
<h5>University of South Australia</h5>
</div>
<div class="timeline-body">
<p>&nbsp;</p>
</div>
<div class="timeline-footer">
<p class="text-right"><i class="far fa-fw fa-calendar-alt"></i> Nov 2008 - Mar 2010</p>
</div>
</div>
</li>

<li class="timeline">
<div class="timeline-badge">
<i class="fa-solid fa-briefcase"></i>
</div>
<div class="timeline-panel" data-aos="fade-up">
<div class="timeline-heading">
<h4>Four Stars Enterprises</h4>
<h5>Graphic Artist</h5>
</div>
<div class="timeline-body">
<p>&nbsp;</p>
</div>
<div class="timeline-footer">
<p class="text-right"><i class="far fa-fw fa-calendar-alt"></i> Jan 2007 - Sep 2008</p>
</div>
</div>
</li>

<li class="timeline-inverted">
<div class="timeline-badge">
<i class="fa-solid fa-graduation-cap"></i>
</div>
<div class="timeline-panel" data-aos="fade-up">
<div class="timeline-heading">
<h4>Basic Certificate in Visual Communication</h4>
<h5>Nanyang Academy of Fine Arts</h5>
</div>
<div class="timeline-body">
<p>&nbsp;</p>
</div>
<div class="timeline-footer">
<p class="text-right"><i class="far fa-fw fa-calendar-alt"></i> Jun 2008</p>
</div>
</div>
</li>

<li class="timeline">
<div class="timeline-badge">
<i class="fa-solid fa-briefcase"></i>
</div>
<div class="timeline-panel" data-aos="fade-up">
<div class="timeline-heading">
<h4>Thrive Consultancy</h4>
<h5>Creative Executive</h5>
</div>
<div class="timeline-body">
<p>&nbsp;</p>
</div>
<div class="timeline-footer">
<p class="text-right"><i class="far fa-fw fa-calendar-alt"></i> Jun 2005 - Sep 2006</p>
</div>
</div>
</li>

<li class="timeline-inverted">
<div class="timeline-badge">
<i class="fa-solid fa-graduation-cap"></i>
</div>
<div class="timeline-panel" data-aos="fade-up">
<div class="timeline-heading">
<h4>Advance Diploma in Multimedia Development</h4>
<h5>Singapore Polytechnic</h5>
</div>
<div class="timeline-body">
<p>&nbsp;</p>
</div>
<div class="timeline-footer">
<p class="text-right"><i class="far fa-fw fa-calendar-alt"></i> Jul 2004 - Jun 2005</p>
</div>
</div>
</li>

<li class="clearfix no-float">&nbsp;</li>

</ul>

</div>
</div>
</div>
<div class="clearfix"></div>
</section>
			
	
		
			
				

<section class="section section-bkg" id="contact">
<div class="container">
<div class="row mt-5">
<div class="col-md-12">
<h2 class="section-title">Get In Touch</h2>
</div>
</div>
<div class="row mb-3">
<div class="col-md-12 text-font-md text-center"><a rel="noopener noreferrer" href="https://www.linkedin.com/in/danielcktan/" target="_blank" class="btn btn-lg btn-primary"><i class="fa-brands fa-fw fa-linkedin text-white"></i> Find Me on Linkedin</a></div>
</div>
</div>
</section>
			
		<footer class="py-5 pb-1">
		<div class="container">
			<div class="row">
								
				<div class="col-12 text-center py-0 pb-0 mb-0">
					<small class="copyright">Copyright &copy; 2022 Portfolio of Daniel C K Tan, All Rights Reserved.</small>
				</div>
			</div>
		</div>
	</footer>
		
		<!--<div id="preloader"></div>-->
	<div id="preloader" class="show preloader-bkg position-fixed translate-middle w-100 vh-100 top-50 start-50 d-flex align-items-center justify-content-center">
        <div class="spinner-border spinner-color" style="width: 3rem; height: 3rem;" role="status">
            <span class="sr-only">Loading...</span>
        </div>
    </div>
	
	

	</body>
</html>