<html lang="en">

<head>

<!--

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=yes">

<meta property="og:image" content="/assets/images/preview.png" />

<title>gregory j. orton | product | development | design</title>

<meta name="description" content="Personal site of Gregory J. Orton, Product owner &amp; software engineer.">

<!-- vendor css files -->

<link rel="stylesheet" href="/assets/css/vendor/font-awesome/font-awesome.min.css" />

<link rel="stylesheet" href="/assets/css/vendor/aos/aos.css" />

<link rel="stylesheet" href=" /assets/css/vendor/normalize-css/normalize.css" />

<!-- end vendor css -->

<!-- app css -->

<link rel="stylesheet" href="/assets/css/main.css">

<!-- end app css -->

<link rel="canonical" href="http://ortonomy.co/">

<link rel="alternate" type="application/rss+xml" title="gregory j. orton | product | development | design" href="/feed.xml">

<body>

<!-- uses _MainNavigation SCSS partial for styles -->

<aside class="sidebar no-mobile">

<div class="sidebar-content">

<div class="logo-wrapper">

<img src="/assets/images/logo.svg">

</div>

<div class="sidebar-titles">

<!-- <h1 class="sidebar-title">- Gregory J. Orton -</h1> -->

<h2 class="sidebar-subtitle"><span>product</span><span> | </span><span>design</span> <span> | </span><span>front-end dev</span></h2>

</div>

<nav class="sidebar-nav">

<ul>

<a href="#about"><li data-key="1" class="active">About</li></a>

<a href="#portfolio"><li data-key="2">Portfolio</li></a>

<a href="#experience"><li data-key="2">Experience</li></a>

<a href="https://medium.com/@ortonomy" target="_blank"><li data-key="3">Blog</li></a>

<div class="active-marker"></div>

</ul>

</nav>

</div>

<div class="sidebar-footer">

<div class="contact-links-wrapper">

<a href="https://github.com/ortonomy" target="_blank" class="contact-link"><p class="contact-link-container"><i class="fa fa-github contact-icon"></i><span>ortonomy</span></p></a>

<a href="https://twitter.com/ortonomy_" target="_blank" class="contact-link"><p class="contact-link-container"><i class="fa fa-twitter contact-icon"></i><span>@ortonomy_</span></p></a>

<a href="https://www.linkedin.com/in/gregoryjorton/" target="_blank" class="contact-link"><p class="contact-link-container"><i class="fa fa-linkedin contact-icon"></i><span>gregoryjorton</span></p></a>

</div>

<img class="contact-avatar" src="/assets/images/avatar.svg">

</div>

<section class="all-content">

<header class="content-header-main">

<h1 class="header-text">Let's build nice things.</h1>

<div>

<a href="./assets/pdfs/resume_gregoryorton_201801_website.pdf"><button class="download-resume">Download my résumé</button></a>

</div>

</header>

<article class="content-section " id="about">

<h2 class="content-title" id="hi-there">Hi there!</h2>

<div class="content-title-sub"><span class="content-title-decorator"></span><i class="fa fa-commenting-o"></i><span class="content-title-decorator"></span></div>

<p><strong>So, do you? Like to build nice things, that is?</strong> As a product owner &amp; manager, and as a software engineer, it’s what I do! Whether I’m creating for a global user base, or supporting an internal team, I strive to build delightful experiences that make peoples’ lives easier.</p>

<p><strong>With 10 years of experience</strong> in the digital education space, my milestones include: shaping a product vision on web and on mobile devices for a leading corporation, delivering features and products used globally by over 200k students, and writing classroom content used by more than 3000 teachers worldwide.</p>

<p><strong>Want to know more?</strong> Shoot me a message on <a href="https://twitter.com/ortonomy_" target="blank">Twitter</a> or <a href="https://www.linkedin.com/in/gregoryjorton/" target="blank">LinkedIn</a>, or explore my <a href="https://github.com/ortonomy" target="blank">Github</a> repositories (links open in a new window.)</p>

</article>

<article class="content-section dark">

<h2 class="content-title" id="skills">Skills</h2>

<div class="content-title-sub"><span class="content-title-decorator"></span><i class="fa fa-graduation-cap"></i><span class="content-title-decorator"></span></div>

<p><strong>I am able to wear many hats.</strong> I have a professional level of expertise as a product manager, web developer, and as an academic editor &amp; manager.</p>

<div class="skills-list-wrapper">

<div class="content-column">

<div>

<img alt="mobile device icon" src="assets/images/planner.svg" data-aos="flip-down" data-aos-easing="ease-in-out-quart" data-aos-once="false" data-aos-delay="0" />

<p><strong>I can manage it.</strong> I facilitate communication between disciplines with ease, helping stakeholders, engineers, and designers define vision and value, by talking in their language.</p>

</div>

<div class="content-column">

<div>

<img alt="digital product icon" src="assets/images/designer.svg" data-aos="flip-down" data-aos-easing="ease-in-out-quart" data-aos-once="false" data-aos-delay="150" />

<p><strong>I can design it.</strong> From user research, to wireframes &amp; mockups, or interactive rapid prototypes I can bring ideas to life and maximise buy-in, using the tools of the trade such as <em>Sketch, Flinto, and Zeplin</em>.</p>

</div>

<div class="content-column">

<div>

<img alt="rubkiks cube icon" src="assets/images/executor.svg" data-aos="flip-down" data-aos-easing="ease-in-out-quart" data-aos-once="false" data-aos-delay="300" />

<p><strong>I can develop it.</strong> I use the latest technologies such as <em>graphQL, react.js, and react-native</em> to deliver delightful experiences on web and mobile. I solve design problems with creativity and data-driven analysis.</p>

</div>

</article>

<article class="content-section golden" id="portfolio">

<h2 class="content-title" id="projects--portfolio">Projects &amp; portfolio</h2>

<div class="content-title-sub"><span class="content-title-decorator"></span><i class="fa fa-pencil"></i><span class="content-title-decorator"></span></div>

<p><strong>Boosting organizational memory and resource planning:</strong> Working with freelancers means an inevitable level of flux in availability of quality talent. Teams with even a modest number of freelancer relationships find this data difficult to manage. To solve this, I started <strong>fling.work</strong>, the first ‘freelancer relationship management’ system.</p>

<div class="portfolio-image-container">

<div class="portfolio-image">

<img class="portfolio-real-image" alt="fling.work landing page" src="assets/images/fling_shot.png" data-aos="flip-down" data-aos-easing="ease-in-out-quart" data-aos-once="false" data-aos-delay="0" />

<div class="portfolio-image-popout"></div>

</div>

<div class="portfolio-image">

<img class="portfolio-real-image" alt="fling.work freelancer data" src="assets/images/fling_shot_2.png" data-aos="flip-down" data-aos-easing="ease-in-out-quart" data-aos-once="false" data-aos-delay="0" />

<div class="portfolio-image-popout"></div>

</div>

<p><strong>Open-source &amp; collaborative:</strong> I have open-sourced the app on <a href="https://github.com/ortonomy/flingapp-frontend" target="blank">GitHub</a>. It’s developed with one full-time collaborator and several other freelance developers and tech enthusiasts from a Shanghai-local coding collective called <a href="https://coderbunker.com/" target="blank">Coderbunker</a>.</p>

<div class="content-title-sub"><span class="content-title-decorator"></span><i class="fa fa-pencil"></i><span class="content-title-decorator"></span></div>

<p><strong>Fixing the oldest problem:</strong> In digital language instruction, the biggest barrier to learning is the lack of opportunity to practice and test speaking. We fixed that for mobile users, by creating a new decision-based speaking activity with asynchronous teacher grading and feedback.</p>

<div class="portfolio-image-container_2by3">

<div class="portfolio-image_2by3">

<a href="assets/images/scc_1.png" data-desc="speaking task intro">

<img class="portfolio-real-image_2by3" alt="speaking task intro" src="assets/images/scc_1.png" />

</a>

</div>

<div class="portfolio-image_2by3">

<a href="assets/images/scc_2.png" data-desc="speaking task prompt">

<img class="portfolio-real-image_2by3" alt="speaking task prompt" src="assets/images/scc_2.png" />

</a>

</div>

<div class="portfolio-image_2by3">

<a href="assets/images/scc_3.png" data-desc="speaking task choice">

<img class="portfolio-real-image_2by3" alt="speaking task choice" src="assets/images/scc_3.png" />

</a>

</div>

<div class="portfolio-image_2by3">

<a href="assets/images/scc_4.png" data-desc="speaking task response">

<img class="portfolio-real-image_2by3" alt="speaking task response" src="assets/images/scc_4.png" />

</a>

</div>

<div class="portfolio-image_2by3">

<a href="assets/images/scc_5.png" data-desc="speaking task self assessment I">

<img class="portfolio-real-image_2by3" alt="speaking task self assessment I" src="assets/images/scc_5.png" />

</a>

</div>

<div class="portfolio-image_2by3">

<a href="assets/images/scc_6.png" data-desc="speaking task self assessment II">

<img class="portfolio-real-image_2by3" alt="speaking task self assessment II" src="assets/images/scc_6.png" />

</a>

</div>

<div class="portfolio-image_2by3">

<a href="assets/images/scc_7.png" data-desc="speaking task teacher grading I">

<img class="portfolio-real-image_2by3" alt="speaking task teacher grading I" src="assets/images/scc_7.png" />

</a>

</div>

<div class="portfolio-image_2by3">

<a href="assets/images/scc_8.png" data-desc="speaking task teacher grading II">

<img class="portfolio-real-image_2by3" alt="speaking task teacher grading II" src="assets/images/scc_8.png" />

</a>

</div>

<div class="portfolio-image_2by3">

<a href="assets/images/scc_9.png" data-desc="speaking task teacher grading III">

<img class="portfolio-real-image_2by3" alt="speaking task teacher grading III" src="assets/images/scc_9.png" />

</a>

</div>

<p>Students are asked to spontaneously produce language they’ve been learning and teachers listen to the production giving grades and specific feedback on their errors and areas for improvement.</p>

<div class="content-title-sub"><span class="content-title-decorator"></span><i class="fa fa-pencil"></i><span class="content-title-decorator"></span></div>

<p><strong>Centre of innovation:</strong> as a product designer and part of a cross-functional team, we innovated to bring practice and examination of reading and writing onto the mobile platform. A real challenge given the affordance and constraints of mobile devices.</p>

<div class="portfolio-image-container_2by3">

<div class="portfolio-image_2by3">

<a href="assets/images/reading_1.png" data-desc="reading question collapsed">

<img class="portfolio-real-image_2by3" alt="reading question collapsed" src="assets/images/reading_1.png" />

</a>

</div>

<div class="portfolio-image_2by3">

<a href="assets/images/reading_2.png" data-desc="reading question expanded">

<img class="portfolio-real-image_2by3" alt="reading question expanded" src="assets/images/reading_2.png" />

</a>

</div>

<div class="portfolio-image_2by3">

<a href="assets/images/reading_3.png" data-desc="reading text as email">

<img class="portfolio-real-image_2by3" alt="reading text as email" src="assets/images/reading_3.png" />

</a>

</div>

<div class="portfolio-image_2by3">

<a href="assets/images/writing_1.png" data-desc="writing intro">

<img class="portfolio-real-image_2by3" alt="writing intro" src="assets/images/writing_1.png" />

</a>

</div>

<div class="portfolio-image_2by3">

<a href="assets/images/writing_2.png" data-desc="writing prompt">

<img class="portfolio-real-image_2by3" alt="writing prompt" src="assets/images/writing_2.png" />

</a>

</div>

<div class="portfolio-image_2by3">

<a href="assets/images/writing_3.png" data-desc="writing input example">

<img class="portfolio-real-image_2by3" alt="writing input example" src="assets/images/writing_3.png" />

</a>

</div>

<div class="content-title-sub"><span class="content-title-decorator"></span><i class="fa fa-code"></i><span class="content-title-decorator"></span></div>

<p><strong>Creativity and code:</strong> A collection of my software development projects built for <a href="https://freecodecamp.com/" target="blank">FreeCodeCamp</a></p>

<div class="portfolio-image-container_2by3">

<div class="portfolio-image_2by3">

<a href="https://codepen.io/ortonomy/details/qNjEzX/" data-desc="JS calculator">

<img class="portfolio-real-image_2by3" alt="JS calculator" src="assets/images/codepen_1.png" />

</a>

</div>

<div class="portfolio-image_2by3">

<a href="https://codepen.io/ortonomy/details/KvOeYb" data-desc="procedurally generated cloudscape">

<img class="portfolio-real-image_2by3" alt="procedurally generated cloudscape" src="assets/images/codepen_2.png" />

</a>

</div>

<div class="portfolio-image_2by3">

<a href="https://codepen.io/ortonomy/details/owMBpL/" data-desc="pomodoro timer">

<img class="portfolio-real-image_2by3" alt="pomodoro timer" src="assets/images/codepen_3.png" />

</a>

</div>

<p>You can find more examples of my work on <a href="https://github.com/ortonomy" target="blank">Github</a> or <a href="https://codepen.io/ortonomy/" target="blank">Codepen</a>.</p>

</article>

<article class="content-section" id="experience">

<h2 class="content-title">Experience & Education</h2>

<div class="content-title-sub"><span class="content-title-decorator"></span><i class="fa fa-briefcase"></i><span class="content-title-decorator"></span></div>

<p><strong>All these things that I've done</strong> - a visual history of my work experience and time spent gaining valuable skills</p>

<template id="divider">

<section class="row divider">

<div class="left"></div>

<div class="center"></div>

<div class="right"></div>

</section>

<template id="divider-icon">

<section class="row divider icon">

<div class="left"></div>

<div class="center"></div>

<div class="right"></div>

</section>

<template id="entry-start-left">

<section class="row entry left">

<div class="left role">

<h1 class="title"> </h1>

<h2 class="company"></h2>

<h3 class="location"></h3>

<p class="date"></p>

</div>

<div class="center line"></div>

<div class="right details">

<p class="description"></p>

</div>

</section>

<template id="entry-start-right">

<section class="row entry right">

<div class="left details">

<p class="description"></p>

</div>

<div class="center line"></div>

<div class="right role">

<h1 class="title"> </h1>

<h2 class="company"></h2>

<h3 class="location"></h3>

<p class="date"></p>

</div>

</section>

<article class="container"></article>

<script src="assets/scripts/visual_resume.js"></script>

</article>

<footer class="content-section dark">

<div>

<p class="content-title-sub">&copy; Gregory Orton, 2018</p>

</div>

</footer>

<div class="mobile-navigation">

<span class="mob-nav-text">NAV</span>

<div class="mob-nav-group">

<div class="mob-nav-item"><a href="#about" class="mob-nav-item-a"><span>About</span></a></div>

<div class="mob-nav-item"><a href="#portfolio" class="mob-nav-item-a"><span>Portfolio</span></a></div>

<div class="mob-nav-item"><a href="#experience" class="mob-nav-item-a"><span>Experience</span></a></div>

<div class="mob-nav-item"><a href="https://medium.com/@ortonomy" target="_blank" class="mob-nav-item-a"><span>Blog</span></a></div>

</div>

</body>

<!-- vendor scripts -->

<script src="/assets/scripts/vendor/jquery/jquery-3.3.1.min.js"></script>

<script src="/assets/scripts/vendor/aos/aos.js"></script>

<script src="/assets/scripts/vendor/waypoints/jquery.waypoints.min.js"></script>

<script src="/assets/scripts/app.js"></script>