{"version":3,"sources":["webpack:///./src/components/footer.js","webpack:///./src/components/layout.js","webpack:///./src/pages/case-studies/student-app-course.js","webpack:///./src/components/content-copy.js"],"names":["Footer","className","href","target","rel","Layout","children","VolantisDS","data","fluid","imageOne","childImageSharp","alt","to","imageFour","imageThree","imageFive","query","ContentCopy"],"mappings":"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","file":"component---src-pages-case-studies-student-app-course-js-f7face3e985baabad558.js","sourcesContent":["import React from 'react'\nimport './style.scss'\n\nconst Footer = () => (\n  <section className=\"margin-top-8\">\n    <div className=\"columns is-centered footer-section\">\n      <div className=\"column is-10\">\n        <h3 className=\"footer-title\">Let's Connect</h3>\n        <p className=\"desc\">Feel free to reach out for collaborations or just a friendly hello.</p>\n        <div className=\"contact-text\">\n          <p>willy.syafiq@gmail.com</p>\n          <p>(+62)896 3635 4693</p>\n        </div>\n        <div className=\"social\">\n          <ul>\n            <li><a href=\"https://www.instagram.com/willy.syafiq/\" target=\"_blank\" rel=\"noreferrer\">Instagram</a></li>\n            <span className=\"link-divider\">/</span>\n            <li><a href=\"https://www.linkedin.com/in/willy-ahmad-syafiq-35095610a/\" target=\"_blank\" rel=\"noreferrer\">LinkedIn</a></li>\n            <span className=\"link-divider\">/</span>\n            <li><a href=\"https://twitter.com/willy_as\" target=\"_blank\" rel=\"noreferrer\">Twitter</a></li>\n            <span className=\"link-divider\">/</span>\n            <li><a href=\"https://dribbble.com/willysyafiq\" target=\"_blank\" rel=\"noreferrer\">Dribbble</a></li>\n          </ul>\n        </div>\n      </div>\n    </div>\n  </section>\n)\n\nexport default Footer\n","import React from 'react';\n\nimport './style.scss';\nimport Helmet from './helmet';\nimport Header from './header';\nimport Footer from './footer';\n\nconst Layout = ({ children }) => (\n\t<div>\n\t\t<Helmet />\n\t\t<Header />\n\n\t\t{children}\n\n\t\t<Footer />\n\t</div>\n);\n\nexport default Layout;\n","import React from 'react';\nimport Layout from '../../components/layout';\nimport { graphql, Link } from 'gatsby';\nimport Img from 'gatsby-image';\nimport ContentCopy from '../../components/content-copy';\n// import ContentImageXL from '../../components/content-image-xl';\n// import ContentImageL from '../../components/content-image-l';\n// import ContentImageM from '../../components/content-image-m';\n\n\nconst VolantisDS = ({ data }) => (\n    <Layout>\n        <section className=\"columns is-centered case-studies is-gapless is-multiline\">\n            <div className=\"column is-12\">\n                <Img\n                    className=\"featured-image\"\n                    fluid={data.imageOne.childImageSharp.fluid}\n                    alt=\"Featured Image\"\n                />\n            </div>\n            <div className=\"column is-12 padding-bottom-0 padding-top-0\">\n                <div className=\"columns is-centered\">\n                    <div className=\"column is-5 is-offset-1\">\n                        <div className=\"page-title-wrap margin-bot-3\">\n                            <span className=\"title-decoratiion\"></span>\n                            <h1 className=\"general-page-title\">Student App - Course</h1>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <div className=\"column is-5 padding-top-0\">\n                <div className=\"table-wrapper\">\n                    <table className=\"table is-fullwidth\">\n                        <tbody>\n                            <tr>\n                                <td><h2>Client</h2></td>\n                                <td><p>Gredu - EduTech</p></td>\n                            </tr>\n                            <tr>\n                                <td><h2>Overview</h2></td>\n                                <td>\n                                    <p>Build new income stream with monthly subscription model that separated from main product purchase. Working with CCO, CTO, PM, Visual Designers, and Content to crafting the right product in series of workshops.</p>\n                                    <br />\n                                    <p>It's like merging two big products, this course system covers course module, subscription, bookmark and social share, study Progress, evaluation, and scoring or leveling with rewards.</p>\n                                </td>\n                            </tr>\n                            <tr>\n                                <td><h2>Outcome</h2></td>\n                                <td>\n                                    <p>After some iterations, the MVP version reduced a lot of features in order to get developed and delivered faster, more details in related section below.</p>\n                                </td>\n                            </tr>\n                            <tr>\n                                <td><h2>Timeline</h2></td>\n                                <td><p>It took roughly 2 months from ideation workshops until final approved design.</p></td>\n                            </tr>\n                            <tr>\n                                <td><h2>My Role</h2></td>\n                                <td><p>Product Design</p></td>\n                            </tr>\n                            <tr>\n                                <td><h2>Tools</h2></td>\n                                <td><p>Sketch App, Abstract, Zeplin, InVision.</p></td>\n                            </tr>\n                        </tbody>\n                    </table>\n                </div>\n            </div>\n            <div className=\"columns is-centered padding-top-0 is-multiline\">\n                <div className=\"column is-12\">\n                    <ContentCopy>\n                        <h3>The full case study is coming soon</h3>\n                        <p>In the meantime, you can check out my other projects or let's set up a session so I can present this project for you.</p>\n                        <br />\n                        <p><strong>willy.syafiq@gmail.com</strong></p>\n                    </ContentCopy>\n                </div>\n            </div>\n            <div className=\"column is-12\">\n                <hr />\n            </div>\n\n            {/* More Cases Section  */}\n            <div className=\"column is-10\">\n                <div className=\"columns is-centered is-multiline\">\n                    <div className=\"column is-12\">\n                        <h3 className=\"has-text-centered margin-top-0\">More Case Studies</h3>\n                    </div>\n                    <div className=\"column is-4 is-flex\">\n                        <div className=\"box\">\n                            <div className=\"columns is-centered\">\n                                <div className=\"column is-12\">\n                                    <Link to=\"/case-studies/gredu-design-system-v0.1\">\n                                        <Img fluid={data.imageFour.childImageSharp.fluid} alt=\"featured image\" />\n                                    </Link>\n                                    <div className=\"post-card\">\n                                        <Link to=\"/case-studies/gredu-design-system-v0.1\"><h2 className=\"read-more-title\">Gredu Design System V.01</h2></Link>\n                                        <Link to=\"/case-studies/gredu-design-system-v0.1\"><p className=\"read-more-excerp\">A design system starter that will cover more than 5 products in the school ecosystem (web, iOS, & Android).</p></Link>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                    <div className=\"column is-4 is-flex\">\n                        <div className=\"box\">\n                            <div className=\"columns is-centered\">\n                                <div className=\"column is-12\">\n                                    <Link to=\"/case-studies/hris-markplus\">\n                                        <Img fluid={data.imageThree.childImageSharp.fluid} alt=\"featured image\" />\n                                    </Link>\n                                    <div className=\"post-card\">\n                                        <Link to=\"/case-studies/hris-markplus\"><h2 className=\"read-more-title\">HRIS MarkPlus, Inc.</h2></Link>\n                                        <Link to=\"/case-studies/hris-markplus\"><p>Human resource information system that covers attendance, leave, benefits, employees information, etc.</p></Link>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                    <div className=\"column is-4 is-flex\">\n                        <div className=\"box\">\n                            <div className=\"columns is-centered\">\n                                <div className=\"column is-12\">\n                                    <Link to=\"/case-studies/volantis-design-system\">\n                                        <Img fluid={data.imageFive.childImageSharp.fluid} alt=\"featured image\" />\n                                    </Link>\n                                    <div className=\"post-card\">\n                                        <Link to=\"/case-studies/volantis-design-system\"><h2 className=\"read-more-title\">Volantis Design System</h2></Link>\n                                        <Link to=\"/case-studies/volantis-design-system\"><p className=\"read-more-excerp\">The design language that speaks for B2B startup with a modern approach. Covering foundation, UI Kit (for designer & engineer), design assets central.</p></Link>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n\n        </section>\n    </Layout >\n);\n\nexport default VolantisDS;\n\n\nexport const query = graphql`\n  query studentAppCourseQuery {\n    imageOne:file(relativePath: { eq: \"student-app-course-hero.png\" }) {\n      childImageSharp {\n        fluid(maxWidth:2000){\n          ...GatsbyImageSharpFluid\n        }\n      }\n    }\n    imageTwo:file(relativePath: { eq: \"hris-markplus-mobile-samples.png\" }) {\n        childImageSharp {\n          fluid(maxWidth:2000, quality:80) {\n            ...GatsbyImageSharpFluid\n          }\n        }\n    }\n    imageThree:file(relativePath: { eq: \"hris-markplus.png\" }) {\n        childImageSharp {\n            fluid{\n                ...GatsbyImageSharpFluid\n            }\n        }\n    }\n    imageFour:file(relativePath: { eq: \"gredu-ds-page.png\" }) {\n        childImageSharp{\n            fluid{\n                ...GatsbyImageSharpFluid\n            }\n        }\n    }\n    imageFive:file(relativePath: { eq: \"volantis-ds-page.png\" }) {\n        childImageSharp{\n            fluid{\n                ...GatsbyImageSharpFluid\n            }\n        }\n    }\n\n  }\n`\n","import React from 'react'\nimport './style.scss'\n\nconst ContentCopy = ({ children }) => (\n    <div className=\"content-copy\">\n        {children}\n    </div>\n)\n\nexport default ContentCopy\n"],"sourceRoot":""}