diff options
| author | Xavi Ablaza <xlablaza@gmail.com> | 2017-10-16 10:14:32 +0300 |
|---|---|---|
| committer | Xavi Ablaza <xlablaza@gmail.com> | 2017-10-16 10:14:32 +0300 |
| commit | 2b72067c1839218fb6689e38c269edf7f8146f9e (patch) | |
| tree | 61ff8ade962294ff4efef17f5a64808431740039 /layouts | |
| parent | 84906e95766533a9aeabde2d30b70b8b4de4a473 (diff) | |
Wiring params in partials to config.toml and cleaning up CSS
Diffstat (limited to 'layouts')
| -rw-r--r-- | layouts/index.html | 4 | ||||
| -rw-r--r-- | layouts/partials/case_studies.html | 37 | ||||
| -rw-r--r-- | layouts/partials/footer.html | 27 | ||||
| -rw-r--r-- | layouts/partials/header.html | 14 | ||||
| -rw-r--r-- | layouts/partials/hero.html | 119 | ||||
| -rw-r--r-- | layouts/partials/nav.html | 10 | ||||
| -rw-r--r-- | layouts/partials/process.html | 183 | ||||
| -rw-r--r-- | layouts/partials/scripts.html | 18 |
8 files changed, 395 insertions, 17 deletions
diff --git a/layouts/index.html b/layouts/index.html index cf94345..7501a30 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -1,5 +1,5 @@ <!DOCTYPE html> -<html> +<html lang ="{{ .Site.LanguageCode }}"> <head> {{ partial "header.html" . }} </head> @@ -22,7 +22,7 @@ {{ end }} {{ if .Site.Params.footer.enable }} - {{ partial "footer.html" }} + {{ partial "footer.html" . }} {{ end }} </div> diff --git a/layouts/partials/case_studies.html b/layouts/partials/case_studies.html index e69de29..7a98525 100644 --- a/layouts/partials/case_studies.html +++ b/layouts/partials/case_studies.html @@ -0,0 +1,37 @@ +<section data-scroll-index="2"> + <div class="case-studies"> + <div class="header"> + <h1 class="title">Case Studies</h1> + <h2 class="subtitle">Selected Works</h2> + </div> + <div class="case-studies-wrapper"> + <div class="case-study-item"> + <a href="http://alexiscollado.com/cope.html"><img src="{{ .Site.BaseURL }}img/cope.jpg" alt=""></a> + <h4>Cope iOS App</h4> + <h5>MOBILE APP DESIGN</h5> + <p>Cope is a mobile app that allows mental health help seekers + track their symptoms and medication. I helped them create a minimum + viable product for testing.</p> + <a href="http://alexiscollado.com/cope.html" class="read-more">Read Me</a> + </div> + <div class="case-study-item"> + <a href="http://alexiscollado.com/360pro.html"><img src="{{ .Site.BaseURL }}img/360.jpg" alt=""></a> + <h4>360 Pro Tracker</h4> + <h5>WEB APP DESIGN</h5> + <p>The 360 Pro Tracker is a performance tracking system for + the 360 Pro gym. It tracks an athlete’s statistics and calculates his or + her pro score.</p> + <a href="http://alexiscollado.com/360pro.html" class="read-more">Read Me</a> + </div> + <div class="case-study-item"> + <a href="http://alexiscollado.com/tedx.html"><img src="{{ .Site.BaseURL }}img/tedx.jpg" alt=""></a> + <h4>TEDxADMU Website</h4> + <h5>WEB DESIGN</h5> + <p>The TEDxADMU website was a project for the Ateneo Junior + Marketing Association. It's a project where I helped them reach a 66.8% + conversion rate from scratch.</p> + <a href="http://alexiscollado.com/tedx.html" class="read-more">Read Me</a> + </div> + </div> + </div> +</section> diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index 03698fe..e980a67 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -1,6 +1,7 @@ <footer> <div class="icons"> - <a href="mailto:lex.collado@gmail.com"> + {{ if isset .Site.Params "email" }} + <a href="mailto:{{ .Site.Params.Email }}"> <svg width="16px" height="14px" viewBox="0 0 16 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink"> <!-- Generator: Sketch 41.2 (35397) - http://www.bohemiancoding.com/sketch --> <title>ui-16px-1_email-84</title> @@ -17,7 +18,9 @@ </g> </svg> </a> - <a href="https://facebook.com/lex.collado" target="blank"> + {{ end }} + {{ if isset .Site.Params "facebook" }} + <a href="https://facebook.com/{{ .Site.Params.Facebook }}" target="blank"> <svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink"> <!-- Generator: Sketch 41.2 (35397) - http://www.bohemiancoding.com/sketch --> <title>social-16px_logo-facebook</title> @@ -34,7 +37,9 @@ </g> </svg> </a> - <a href="https://twitter.com/alexiscollado" target="blank"> + {{ end }} + {{ if isset .Site.Params "twitter" }} + <a href="https://twitter.com/{{ .Site.Params.Twitter }}" target="blank"> <svg width="16px" height="14px" viewBox="0 0 16 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink"> <!-- Generator: Sketch 41.2 (35397) - http://www.bohemiancoding.com/sketch --> <title>social-16px_logo-twitter</title> @@ -51,7 +56,9 @@ </g> </svg> </a> - <a href="https://dribbble.com/alexiscollado" target="blank"> + {{ end }} + {{ if isset .Site.Params "dribbble" }} + <a href="https://dribbble.com/{{ .Site.Params.Dribbble }}" target="blank"> <svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink"> <!-- Generator: Sketch 41.2 (35397) - http://www.bohemiancoding.com/sketch --> <title>social-16px_logo-dribbble</title> @@ -68,7 +75,9 @@ </g> </svg> </a> - <a href="https://www.linkedin.com/in/alexander-hans-collado-jr-9444146a" target="blank"> + {{ end }} + {{ if isset .Site.Params "linkedin" }} + <a href="{{ .Site.Params.LinkedIn }}" target="blank"> <svg width="17px" height="16px" viewBox="0 0 17 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink"> <!-- Generator: Sketch 41.2 (35397) - http://www.bohemiancoding.com/sketch --> <title>social-16px_logo-linkedin</title> @@ -85,11 +94,13 @@ </g> </svg> </a> - <a href="https://medium.com/@ahvccollado" target="blank"> + {{ end }} + {{ if isset .Site.Params "medium" }} + <a href="https://medium.com/@{{ .Site.Params.Medium }}" target="blank"> <img src="img/medium.png" style="width: 16px;" alt=""> </a> + {{ end }} </div> - <a href="#" style="color: #574cdd - ; text-decoration: underline;" data-scroll-goto="0">Back to top</a> + <a href="#" style="color: #574cdd; text-decoration: underline;" data-scroll-goto="0">Back to top</a> </footer>
\ No newline at end of file diff --git a/layouts/partials/header.html b/layouts/partials/header.html index 2e26506..593787c 100644 --- a/layouts/partials/header.html +++ b/layouts/partials/header.html @@ -5,16 +5,16 @@ <meta name="theme-color" content="#574CDD"> <!-- desc --> -<meta name="description" content="Portfolio of Alexis Collado, UX Designer"> -<meta property="og:description" content="Portfolio of Alexis Collado, UX Designer"> -<meta name="twitter:description" content="Portfolio of Alexis Collado, UX Designer"> +<meta name="description" content="Portfolio of {{ .Site.Params.my_name }}, {{ .Site.Params.job_position }}"> +<meta property="og:description" content="Portfolio of {{ .Site.Params.my_name }}, {{ .Site.Params.job_position }}"> +<meta name="twitter:description" content="Portfolio of {{ .Site.Params.my_name }}, {{ .Site.Params.job_position }}"> <!-- image --> -<meta property="og:image" content="portfolio.jpg"> -<meta name="twitter:image" content="portfolio.jpg"> +<meta property="og:image" content="{{ .Site.BaseURL }}img/portfolio.jpg"> +<meta name="twitter:image" content="{{ .Site.BaseURL }}img/portfolio.jpg"> -<link rel="icon" href="img/favicon.png" type="image/x-icon"> -<link rel="shortcut icon" href="img/favicon.png" type="image/x-icon"> +<link rel="icon" href="{{ .Site.BaseURL }}img/favicon.png" type="image/x-icon"> +<link rel="shortcut icon" href="{{ .Site.BaseURL }}img/favicon.png" type="image/x-icon"> <link rel="stylesheet" href="css/css.css" > <link rel="stylesheet" href="css/final.css"> diff --git a/layouts/partials/hero.html b/layouts/partials/hero.html index e69de29..c6acabb 100644 --- a/layouts/partials/hero.html +++ b/layouts/partials/hero.html @@ -0,0 +1,119 @@ +<section style="padding-top: 120px;" id="scroll-element" data-scroll-index="0"> + <div class="hero"> + <div class="hero-left"> + <img src="{{ .Site.BaseURL }}img/{{ .Site.Params.Hero.Avatar }}" style="max-width: 50%; border-radius: 50%; "> + <h2 class="subtitle">{{ .Site.Params.Hero.subtitle }}</h2> + <div class="icons"> + {{ if isset .Site.Params "email" }} + <a href="mailto:{{ .Site.Params.Email }}"> + <svg width="16px" height="14px" viewBox="0 0 16 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink"> + <!-- Generator: Sketch 41.2 (35397) - http://www.bohemiancoding.com/sketch --> + <title>ui-16px-1_email-84</title> + <desc>Created with Sketch.</desc> + <defs></defs> + <g id="Portfolio" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-94.000000, -336.000000)" id="Group" fill="#505050"> + <g transform="translate(94.000000, 335.000000)"> + <g id="ui-16px-1_email-84" transform="translate(0.000000, 1.000000)"> + <path d="M15,0 L1,0 C0.448,0 0,0.447 0,1 L0,13 C0,13.553 0.448,14 1,14 L15,14 C15.552,14 16,13.553 16,13 L16,1 C16,0.447 15.552,0 15,0 Z M14,12 L2,12 L2,5.723 L7.504,8.868 C7.812,9.044 8.189,9.044 8.496,8.868 L14,5.723 L14,12 Z M14,3.42 L8,6.849 L2,3.42 L2,2 L14,2 L14,3.42 Z" id="Shape"></path> + </g> + </g> + </g> + </g> + </svg> + </a> + {{ end }} + {{ if isset .Site.Params "facebook" }} + <a href="https://facebook.com/{{ .Site.Params.Facebook }}" target="blank"> + <svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink"> + <!-- Generator: Sketch 41.2 (35397) - http://www.bohemiancoding.com/sketch --> + <title>social-16px_logo-facebook</title> + <desc>Created with Sketch.</desc> + <defs></defs> + <g id="Portfolio" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-131.000000, -335.000000)" id="Group" fill="#505050"> + <g transform="translate(94.000000, 335.000000)"> + <g id="social-16px_logo-facebook" transform="translate(37.000000, 0.000000)"> + <path d="M15.3,0 L0.7,0 C0.3,0 0,0.3 0,0.7 L0,15.4 C0,15.7 0.3,16 0.7,16 L8,16 L8,11 L6,11 L6,8 L8,8 L8,6 C8,3.9 9.2,3 11,3 L13,3 L13,6 L12,6 C11.4,6 11,6.4 11,7 L11,8 L13.6,8 L13,11 L11,11 L11,16 L15.3,16 C15.7,16 16,15.7 16,15.3 L16,0.7 C16,0.3 15.7,0 15.3,0 Z" id="White_2_"></path> + </g> + </g> + </g> + </g> + </svg> + </a> + {{ end }} + {{ if isset .Site.Params "twitter" }} + <a href="https://twitter.com/a{{ .Site.Params.Twitter }}" target="blank"> + <svg width="16px" height="14px" viewBox="0 0 16 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink"> + <!-- Generator: Sketch 41.2 (35397) - http://www.bohemiancoding.com/sketch --> + <title>social-16px_logo-twitter</title> + <desc>Created with Sketch.</desc> + <defs></defs> + <g id="Portfolio" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-169.000000, -336.000000)" id="Group" fill="#505050"> + <g transform="translate(94.000000, 335.000000)"> + <g id="social-16px_logo-twitter" transform="translate(75.000000, 1.000000)"> + <path d="M16,2 C15.4,2.3 14.8,2.4 14.1,2.5 C14.8,2.1 15.3,1.5 15.5,0.7 C14.9,1.1 14.2,1.3 13.4,1.5 C12.8,0.9 11.9,0.5 11,0.5 C9.3,0.5 7.8,2 7.8,3.8 C7.8,4.1 7.8,4.3 7.9,4.5 C5.2,4.4 2.7,3.1 1.1,1.1 C0.8,1.6 0.7,2.1 0.7,2.8 C0.7,3.9 1.3,4.9 2.2,5.5 C1.7,5.5 1.2,5.3 0.7,5.1 L0.7,5.1 C0.7,6.7 1.8,8 3.3,8.3 C3,8.4 2.7,8.4 2.4,8.4 C2.2,8.4 2,8.4 1.8,8.3 C2.2,9.6 3.4,10.6 4.9,10.6 C3.8,11.5 2.4,12 0.8,12 L0,12 C1.5,12.9 3.2,13.5 5,13.5 C11,13.5 14.3,8.5 14.3,4.2 L14.3,3.8 C15,3.3 15.6,2.7 16,2 Z" id="Shape"></path> + </g> + </g> + </g> + </g> + </svg> + </a> + {{ end }} + {{ if isset .Site.Params "dribbble" }} + <a href="https://dribbble.com/{{ .Site.Params.Dribbble }}" target="blank"> + <svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink"> + <!-- Generator: Sketch 41.2 (35397) - http://www.bohemiancoding.com/sketch --> + <title>social-16px_logo-dribbble</title> + <desc>Created with Sketch.</desc> + <defs></defs> + <g id="Portfolio" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-206.000000, -335.000000)" id="Group" fill="#505050"> + <g transform="translate(94.000000, 335.000000)"> + <g id="social-16px_logo-dribbble" transform="translate(112.000000, 0.000000)"> + <path d="M8,0 C3.6,0 0,3.6 0,8 C0,12.4 3.6,16 8,16 C12.4,16 16,12.4 16,8 C16,3.6 12.4,0 8,0 Z M10.2,7.4 C10.2,7.4 10,6.8 9.9,6.6 C11.6,5.8 12.7,4.9 13.1,4.4 C13.8,5.3 14.2,6.4 14.3,7.6 C13.5,7.4 11.7,7.1 10.2,7.4 Z M9.1,5.1 C8.3,3.7 7.4,2.5 7,1.8 C8.9,1.3 10.6,1.9 11.9,3.1 C11.5,3.6 10.7,4.4 9.1,5.1 Z M5.1,2.5 C5.5,3 6.3,4.2 7.1,5.7 C4.9,6.2 2.9,6.3 2,6.3 C2.4,4.7 3.6,3.3 5.1,2.5 Z M8,7.3 C8.1,7.5 8.2,7.7 8.3,7.8 C5.5,8.7 3.7,11 3.1,11.9 C2.3,10.8 1.8,9.5 1.8,8.2 C2.7,8.1 5.3,8 8,7.3 Z M9,9.5 C9.7,11.5 10.1,13.1 10.2,13.9 C8.1,14.6 5.7,14.2 4.4,13.1 C4.8,12.4 6.1,10.6 9,9.5 Z M11.9,12.9 C11.7,12.1 11.4,10.7 10.8,9 C11.9,8.8 13.5,9 14.1,9.2 C13.8,10.7 13,12 11.9,12.9 Z" id="Shape"></path> + </g> + </g> + </g> + </g> + </svg> + </a> + {{ end }} + {{ if isset .Site.Params "linkedin" }} + <a href="{{ .Site.Params.LinkedIn }}" target="blank"> + <svg width="17px" height="16px" viewBox="0 0 17 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink"> + <!-- Generator: Sketch 41.2 (35397) - http://www.bohemiancoding.com/sketch --> + <title>social-16px_logo-linkedin</title> + <desc>Created with Sketch.</desc> + <defs></defs> + <g id="Portfolio" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-243.000000, -335.000000)" id="Group" fill="#505050"> + <g transform="translate(94.000000, 335.000000)"> + <g id="social-16px_logo-linkedin" transform="translate(149.000000, 0.000000)"> + <path d="M15.3,0 L0.7,0 C0.3,0 0,0.3 0,0.7 L0,15.4 C0,15.7 0.3,16 0.7,16 L15.4,16 C15.8,16 16.1,15.7 16.1,15.3 L16.1,0.7 C16,0.3 15.7,0 15.3,0 Z M4.7,13.6 L2.4,13.6 L2.4,6 L4.8,6 L4.8,13.6 L4.7,13.6 Z M3.6,5 C2.8,5 2.2,4.3 2.2,3.6 C2.2,2.8 2.8,2.2 3.6,2.2 C4.4,2.2 5,2.8 5,3.6 C4.9,4.3 4.3,5 3.6,5 Z M13.6,13.6 L11.2,13.6 L11.2,9.9 C11.2,9 11.2,7.9 10,7.9 C8.8,7.9 8.6,8.9 8.6,9.9 L8.6,13.7 L6.2,13.7 L6.2,6 L8.5,6 L8.5,7 L8.5,7 C8.8,6.4 9.6,5.8 10.7,5.8 C13.1,5.8 13.5,7.4 13.5,9.4 L13.5,13.6 L13.6,13.6 Z" id="Shape"></path> + </g> + </g> + </g> + </g> + </svg> + </a> + {{ end }} + {{ if isset .Site.Params "medium" }} + <a href="https://medium.com/@{{ .Site.Params.Medium }}" target="blank"> + <!--?xml version="1.0" encoding="UTF-8"?--> + <img src="{{ .Site.BaseURL }}img/medium.png" style="width: 16px;" alt=""> + </a> + {{ end }} + </div> + <a href="{{ .Site.BaseURL }}ResumeCollado.pdf" target="blank" class="download-resume" onclick="ga('send', {hitType: 'event',eventCategory: 'CTA',eventAction: 'download',});"> + <svg style="position: relative;top: 1.8px;padding-right: 1.5em;" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16"><g><polygon data-color="color-2" fill="#b6c9fe" points="9,8 9,1 7,1 7,8 4.6,8 8,12 11.4,8 "></polygon> + <path fill="#b6c9fe" d="M15,16H1c-0.6,0-1-0.4-1-1V6c0-0.6,0.4-1,1-1h3v2H2v7h12V7h-2V5h3c0.6,0,1,0.4,1,1v9C16,15.6,15.6,16,15,16z"></path></g></svg>Download Resume</a> + </div> + <div class="hero-right"> + {{ range $paragraph := .Site.Params.Hero.hero_right }} + <p>{{ $paragraph | markdownify }}</p> + {{ end }} + </div> + </div> +</section>
\ No newline at end of file diff --git a/layouts/partials/nav.html b/layouts/partials/nav.html index e69de29..9505f88 100644 --- a/layouts/partials/nav.html +++ b/layouts/partials/nav.html @@ -0,0 +1,10 @@ +<nav class="main-navigation stuckMenu"> + <a href="index.html"> + <img class="logo" src="{{ .Site.BaseURL }}img/logo.png" alt="My Portfolio"> + </a> + <div class="sub-navigation"> + <a href="#" class="main-navigation-link" id="about" data-scroll-goto="0">About</a> + <a href="#" class="main-navigation-link" id="process-link" data-scroll-goto="1">Process</a> + <a href="#" class="main-navigation-link" data-scroll-goto="2">Case Studies</a> + </div> +</nav>
\ No newline at end of file diff --git a/layouts/partials/process.html b/layouts/partials/process.html index e69de29..9ffea96 100644 --- a/layouts/partials/process.html +++ b/layouts/partials/process.html @@ -0,0 +1,183 @@ +<section data-scroll-index="1"> + <div class="process"> + <div class="header"> + <h1 class="title">{{ .Site.Params.Process.Title }}</h1> + <h2 class="subtitle">{{ .Site.Params.Process.Subtitle }}</h2> + </div> + <div class="process-wrapper"> + <div class="process-item"> + <figure class="item-header"> + <svg width="34px" height="31px" viewBox="0 0 34 31" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink"> + <!-- Generator: Sketch 41.2 (35397) - http://www.bohemiancoding.com/sketch --> + <title>design-64px-outline_book-open</title> + <desc>Created with Sketch.</desc> + <defs></defs> + <g id="Portfolio" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-89.000000, -786.000000)" id="Group-10" stroke-width="2"> + <g transform="translate(90.000000, 780.000000)"> + <g id="design-64px-outline_book-open" transform="translate(0.000000, 7.000000)"> + <g id="Group"> + <path d="M16,3.73333333 L16,18.1333333" id="Shape" stroke="#00CEDB"></path> + <polyline id="Shape" stroke="#505050" points="28.8 3.2 32 3.2 32 28.8 0 28.8 0 3.2 3.2 3.2"></polyline> + <path d="M16,3.73333333 C12.4,1.0224 7.64426667,0 3.2,0 L3.2,21.8666667 C7.64426667,21.8666667 12.4,22.8890667 16,25.6 C19.6,22.8890667 24.3557333,21.8666667 28.8,21.8666667 L28.8,0 C24.3557333,0 19.6,1.0224 16,3.73333333 Z" id="Shape" stroke="#505050"></path> + </g> + </g> + </g> + </g> + </g> + </svg> + <h3>Research</h3> + </figure> + <p>I collaborate with stakeholders, ask meaningful questions, probe user goals, motivations, to understand context.</p> + </div> + <div class="process-item"> + <figure class="item-header"> + <svg width="34px" height="37px" viewBox="0 0 34 37" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink"> + <!-- Generator: Sketch 41.2 (35397) - http://www.bohemiancoding.com/sketch --> + <title>design-64px-outline-2_ruler-pencil</title> + <desc>Created with Sketch.</desc> + <defs></defs> + <g id="Portfolio" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-565.000000, -780.000000)" id="Group-11" stroke-width="2"> + <g transform="translate(560.000000, 777.000000)"> + <g id="design-64px-outline-2_ruler-pencil" transform="translate(6.000000, 4.000000)"> + <g id="Group"> + <path d="M26.2857143,5.71428571 L26.2857143,26.2857143" id="Shape" stroke="#00CEDB"></path> + <path d="M20.5714286,5.71428571 L32,5.71428571" id="Shape" stroke="#505050"></path> + <path d="M20.5714286,26.2857143 L32,26.2857143" id="Shape" stroke="#505050"></path> + <polygon id="Shape" stroke="#505050" points="32 26.2857143 26.2857143 33.1428571 20.5714286 26.2857143 20.5714286 0 32 0"></polygon> + <path d="M0,16 L5.14285714,16" id="Shape" stroke="#00CEDB"></path> + <path d="M0,20.5714286 L4,20.5714286" id="Shape" stroke="#00CEDB"></path> + <path d="M0,29.7142857 L4,29.7142857" id="Shape" stroke="#00CEDB"></path> + <path d="M0,6.85714286 L5.14285714,6.85714286" id="Shape" stroke="#00CEDB"></path> + <path d="M0,11.4285714 L4,11.4285714" id="Shape" stroke="#00CEDB"></path> + <path d="M0,25.1428571 L5.14285714,25.1428571" id="Shape" stroke="#00CEDB"></path> + <rect id="Rectangle-path" stroke="#505050" x="0" y="0" width="13.7142857" height="34.2857143"></rect> + </g> + </g> + </g> + </g> + </g> + </svg> + <h3>Discovery</h3> + </figure> + <p>I ideate solutions by wireframing or creating mockups, facilitate design studios, and gather user feedback.</p> + </div> + <div class="process-item"> + <figure class="item-header"> + <svg width="34px" height="30px" viewBox="0 0 34 30" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink"> + <!-- Generator: Sketch 41.2 (35397) - http://www.bohemiancoding.com/sketch --> + <title>design-64px-outline_window-paragraph</title> + <desc>Created with Sketch.</desc> + <defs></defs> + <g id="Portfolio" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-1029.000000, -783.000000)" id="Group-12" stroke-width="2"> + <g transform="translate(1030.000000, 777.000000)"> + <g id="design-64px-outline_window-paragraph" transform="translate(0.000000, 7.000000)"> + <g id="Group"> + <rect id="Rectangle-path" stroke="#505050" x="4.26666667" y="13.3333333" width="8.53333333" height="8.53333333"></rect> + <path d="M16.5333333,13.3333333 L27.7333333,13.3333333" id="Shape" stroke="#00CEDB"></path> + <path d="M16.5333333,17.6 L27.7333333,17.6" id="Shape" stroke="#00CEDB"></path> + <path d="M16.5333333,21.8666667 L22.9333333,21.8666667" id="Shape" stroke="#00CEDB"></path> + <path d="M4.26666667,3.73333333 L6.4,3.73333333" id="Shape" stroke="#00CEDB"></path> + <path d="M9.6,3.73333333 L11.7333333,3.73333333" id="Shape" stroke="#00CEDB"></path> + <path d="M21.8666667,3.73333333 L27.7333333,3.73333333" id="Shape" stroke="#00CEDB"></path> + <path d="M0,7.46666667 L32,7.46666667" id="Shape" stroke="#00CEDB"></path> + <rect id="Rectangle-path" stroke="#505050" x="0" y="0" width="32" height="27.7333333"></rect> + </g> + </g> + </g> + </g> + </g> + </svg> + <h3>Design</h3> + </figure> + <p>I design delightful, purposeful interactions and interfaces that help the user accomplish his or her tasks.</p> + </div> + <div class="process-item"> + <figure class="item-header"> + <svg width="36px" height="27px" viewBox="0 0 36 27" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink"> + <!-- Generator: Sketch 41.2 (35397) - http://www.bohemiancoding.com/sketch --> + <title>design-64px-outline_code</title> + <desc>Created with Sketch.</desc> + <defs></defs> + <g id="Portfolio" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-88.000000, -964.000000)" id="Group-18" stroke-width="2"> + <g transform="translate(90.000000, 957.000000)"> + <g id="Group-13"> + <g id="design-64px-outline_code" transform="translate(0.000000, 8.000000)"> + <g id="Group"> + <polyline id="Shape" stroke="#505050" points="6.85714286 5.71428571 0 12.5714286 6.85714286 19.4285714"></polyline> + <polyline id="Shape" stroke="#505050" points="25.1428571 5.71428571 32 12.5714286 25.1428571 19.4285714"></polyline> + <path d="M11.4285714,25.1428571 L20.5714286,0" id="Shape" stroke="#00CEDB"></path> + </g> + </g> + </g> + </g> + </g> + </g> + </svg> + <h3>Development</h3> + </figure> + <p>I prototype the final design either in code (HTML, CSS, JS), Invision, Framer Studio or other tools depending on the job.</p> + </div> + <div class="process-item"> + <figure class="item-header"> + <svg width="35px" height="35px" viewBox="0 0 35 35" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink"> + <!-- Generator: Sketch 41.2 (35397) - http://www.bohemiancoding.com/sketch --> + <title>design-64px-outline_wand-99</title> + <desc>Created with Sketch.</desc> + <defs></defs> + <g id="Portfolio" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-558.000000, -961.000000)" id="Group-17"> + <g transform="translate(560.000000, 957.000000)"> + <g id="Group-14"> + <g id="design-64px-outline_wand-99" transform="translate(0.000000, 5.000000)"> + <g id="Group"> + <path d="M32,6.50847458 C30.4379661,4.94644068 27.0535593,4.94644068 25.4915254,6.50847458 C27.0535593,4.94644068 27.0535593,1.5620339 25.4915254,0 C27.0535593,1.5620339 30.4379661,1.5620339 32,0 C30.4379661,1.5620339 30.4379661,4.94644068 32,6.50847458 Z" id="Shape" stroke="#00CEDB" stroke-width="2"></path> + <path d="M30.9152542,22.779661 C29.8738983,21.7383051 27.6176271,21.7383051 26.5762712,22.779661 C27.6176271,21.7383051 27.6176271,19.4820339 26.5762712,18.440678 C27.6176271,19.4820339 29.8738983,19.4820339 30.9152542,18.440678 C29.8738983,19.4820339 29.8738983,21.7383051 30.9152542,22.779661 Z" id="Shape" stroke="#00CEDB" stroke-width="2"></path> + <path d="M13.559322,5.42372881 C12.5179661,4.38237288 10.2616949,4.38237288 9.22033898,5.42372881 C10.2616949,4.38237288 10.2616949,2.12610169 9.22033898,1.08474576 C10.2616949,2.12610169 12.5179661,2.12610169 13.559322,1.08474576 C12.5179661,2.12610169 12.5179661,4.38237288 13.559322,5.42372881 Z" id="Shape" stroke="#00CEDB" stroke-width="2"></path> + <path d="M15.1864407,11.9322034 L20.0677966,16.8135593" id="Shape" stroke="#505050" stroke-width="2"></path> + <rect id="Rectangle-path" stroke="#505050" stroke-width="1.99998082" transform="translate(11.931795, 20.067934) rotate(-45.000000) translate(-11.931795, -20.067934) " x="-1.49099184" y="16.6163062" width="26.8455731" height="6.90325583"></rect> + </g> + </g> + </g> + </g> + </g> + </g> + </svg> + <h3>Iteration</h3> + </figure> + <p>I perform research through series of usability tests and A/B testing, evaluate design with analytics, and iterate.</p> + </div> + <div class="process-item"> + <figure class="item-header"> + <svg width="34px" height="34px" viewBox="0 0 34 34" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink"> + <!-- Generator: Sketch 41.2 (35397) - http://www.bohemiancoding.com/sketch --> + <title>arrows-64px-outline-1_refresh-69</title> + <desc>Created with Sketch.</desc> + <defs></defs> + <g id="Portfolio" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-1029.000000, -963.000000)" id="Group-16" stroke-width="2"> + <g transform="translate(1030.000000, 957.000000)"> + <g id="Group-15"> + <g id="arrows-64px-outline-1_refresh-69" transform="translate(0.000000, 7.000000)"> + <g id="Group"> + <path d="M0,16 C0,7.16342857 7.16342857,0 16,0 C22.4485714,0 28.0737143,3.984 30.6062857,9.48" id="Shape" stroke="#505050"></path> + <polyline id="Shape" stroke="#505050" points="31.8765714 0 30.6062857 9.48 21.1268571 8.20971429"></polyline> + <path d="M32,16 C32,24.8365714 24.8365714,32 16,32 C9.55142857,32 3.92628571,28.016 1.39371429,22.52" id="Shape" stroke="#00CEDB"></path> + <polyline id="Shape" stroke="#00CEDB" points="0.123428571 32 1.39371429 22.52 10.8731429 23.7902857"></polyline> + </g> + </g> + </g> + </g> + </g> + </g> + </svg> + <h3>Repeat</h3> + </figure> + <p>I redo the entire process and use new insights to further bolster the product’s user experience.</p> + </div> + </div> + </div> +</section>
\ No newline at end of file diff --git a/layouts/partials/scripts.html b/layouts/partials/scripts.html new file mode 100644 index 0000000..8e10c18 --- /dev/null +++ b/layouts/partials/scripts.html @@ -0,0 +1,18 @@ +<script src="{{ .Site.BaseURL }}js/jquery-1.js"></script> +<script src="{{ .Site.BaseURL }}js/stickUp.js"></script> +<script src="{{ .Site.BaseURL }}js/scrollIt.js" type="text/javascript"></script> +<script type="text/javascript"> + jQuery(function($) { + $(document).ready( function() { + $('.main-navigation').stickUp({ + + }); + }); + }); + $(function(){ + $.scrollIt({ + topOffset: -70, // offste (in px) for fixed top navigation + easing: 'ease-in-out' + }); + }); +</script>
\ No newline at end of file |