I blend professionalism and creativity. My aim is simple: bring your ideas to life. My websites are often fun and bold and full of interesting interaction.
-
Projects include:
+
+
My primary goal is simple: bring your ideas to life. My websites are often fun, bold and full of interesting interaction.
+
Projects I worked on include:
Marketing websites
E-commerce websites
@@ -90,26 +91,34 @@
Interactive online comics
Browser games
-
-
I center on crafting interfaces that dazzle visually and deliver an instinctive user journey. The essence is to make your users feel at home in the interaction with your content.
-
Should your venture demand a backend touch, like managing databases or Content Management, I'm well-versed in leveraging existing open source solutions. I advocate for savvy fixes, seamlessly tailored to harmonize with your project.
-
-
As a frontend developer, I'm not your guy for the intricate machinery that powers colossal enterprise web applications. Put simply, I can't whip up an Amazon or a TikTok from the ground up.
+
+
As a frontend developer, I'm not your guy for the intricate machinery that powers colossal enterprise web applications. Put simply, I can't whip up an Amazon or a TikTok from the ground up.
Moreover, my moral code is steadfast. Requests involving, but not confined to, promoting weapons manufacturers or propagating conspiracy theories won't find a home with me. I must politely decline such propositions.
-
A web browser understands only HTML, CSS, and Javascript. Mastery of these is the bedrock for crafting top-notch web applications.
-
Further, I've treaded diverse coding landscapes, navigating the realms of PHP, Perl, and Python. Among the myriad frameworks danced with, names like React, Svelte, Eleventy, Astro, and the esteemed Ruby on Rails echo.
-
I serve as your counsel, steering you toward the optimal solution tailored to your project's idiosyncrasies.
-
Should you possess a standing website, yearning for expansion, toss me the code, and we'll unravel the possibilities together. Not encountered a site I couldn't tame, so far.
-
And, sometimes, the most fitting scaffold is none at all. I crafted some elegant, straightforward websites in the raw embrace of HTML, CSS, and JS.
+
A web browser understands only HTML, CSS, and Javascript. Mastery of these is the bedrock for crafting top-notch web applications.
+
Among the popular modern Javascript frameworks, I have experience with React and Svelte. In terms of meta frameworks I have so far used NextJS, SvelteKit, Eleventy, and Astro.
+
On the server-side, I found myself using languages such as PHP, Perl, and Python.
+
If you don't know any of the above, I can serve as your counsel, steering you toward the optimal solution for your project's specific goals.
+
Should you have a standing website, yearning for expansion, toss me the code, and we'll unravel the possibilities together.
+
Sometimes, the most fitting framework is none at all. I crafted some elegant, straightforward websites in the raw embrace of HTML, CSS, and JS.
-
-
I've tinkered with various Content Management Systems — the likes of WordPress, Strapi, Builder, Magento, and Shopify. Each carries its own set of virtues and vices.
+
+
I've worked with various Content Management Systems — the likes of WordPress, Strapi, Builder, Magento, and Shopify. Each carries its own set of virtues and vices.
Let's talk about the folks responsible for constructing and upkeeping your content. Only then can we jointly discern the optimal solution.
+
+
Search Engine Optimisation (SEO) is a collaborative effort between the developers of a website and the content creators. I can definitely provide the technical baseline for all content and metadata (eg page descriptions or manifests) to be accessible to search engines.
+
However, the ranking of Search Results depends on many factors, and the biggest one is by far the quality of the content. If your content strategy is sound and attracts many users, resulting in other reputable pages linking to yours, that's when you'll surely climb the ladders on Google & Co's results.
+
+
+
There are loads of Data Protection and Privacy Legislation laws in place today in many different countries.
+
I can implement the necessary technical steps to become compliant, but I will rely on you to know which law is applicable to you and what that means in terms of requirements.
+
These will also greatly depend on your own requirements, for example whether you will need to use analytics or other 3rd party software that collects user data.
+
In many cases, the installation of a commercial software is the easiest way to reach compliance. These can auto-detect cookies and data-collection from 3rd parties, block them and display a consent-banner before reactivating them.
+
@@ -122,6 +131,8 @@
Prototyping for interactive products, to gain understanding of the user experience prior to production
Illustration & animation to bring your ideas to life
Data visualisation to aid crucial information cross the seas of abstraction
+ {/if}
+
+
+
\ No newline at end of file
diff --git a/src/routes/work/md/adidas.md b/src/routes/work/md/adidas.md
index df0db3b..5328135 100644
--- a/src/routes/work/md/adidas.md
+++ b/src/routes/work/md/adidas.md
@@ -1,13 +1,16 @@
---
title: Adidas
header_bg_image: adidas_hero_ceurd8
+images: [ '/work/adidas/adidas_hero_ceurd8', '/work/adidas/adidas-mockup_ozihu3', '/work/adidas/adidas-illus-bg_t2t5ts' ]
order: 12
tags: ['graphic design', 'illustration']
-description: Adidas, as you might have heard, is an international sports and lifestyle clothing brand. I worked on several digital campaigns as a graphic designer and illustrator.
+description: Design & Illustration for the international sports and lifestyle clothing brand.
svg: ''
+reference: https://www.linkedin.com/in/stanislasdupart/
+referenceName: Stan Dupart
---
-# adidas is all in
+As a freelancer embedded in adidas' ecommerce and digital experiences team, I worked on digital campaigns and assets.
-Adidas, as you might have heard, is an international sports and lifestyle clothing brand. I worked on several digital campaigns as a graphic designer and illustrator.
+I created illustrations, animations, and graphics for the adidas website, social media, and newsletters.
diff --git a/src/routes/work/md/booking.md b/src/routes/work/md/booking.md
new file mode 100644
index 0000000..73e15d6
--- /dev/null
+++ b/src/routes/work/md/booking.md
@@ -0,0 +1,14 @@
+---
+title: Booking.com
+description: I worked at Booking.com as a UX Designer and Team lead
+images: ['work/booking/booking_hero_jtrmdm', 'work/booking/booking_join_screen01_hrfsby', 'work/booking/booking_infograph_lbdlzk', 'work/booking/booking_enterprise_screen02_sptotl']
+reference: https://www.linkedin.com/in/marco-broccoli/
+referenceName: Marco Broccoli
+tags: ['UX Design', 'Frontend Development', 'Team Lead']
+svg: ''
+---
+Booking.com is one of the biggest accommodation reservation services in the world. Each day, over a million room nights are reserved through its websites and apps.
+
+I worked on a multitude of projects, touching many of the company's products (websites, native Android & iOS apps, PWAs).
+
+Working at Booking required justifying all changes or innovations with hard proof from measured metrics. This is obviously only feasible with an enormous user base, but it's a great and interesting way to learn about the impact of design decisions.
\ No newline at end of file
diff --git a/src/routes/work/md/etosis.md b/src/routes/work/md/etosis.md
new file mode 100644
index 0000000..5b283bb
--- /dev/null
+++ b/src/routes/work/md/etosis.md
@@ -0,0 +1,26 @@
+---
+title: etosis
+images: ['work/etosis/etosis_og_ogqfae', 'https://res.cloudinary.com/dkvjosg5p/video/upload/v1696948648/work/etosis/etosis_mail_wawrua.webm', 'work/etosis/scrnli_Oct_10_2023_3_._xkz9er', 'work/etosis/scrnli_Oct_10_2023_2_._lxh0xh' ]
+description: Simple housestyle and website for a software company specialised in complexity
+referenceName: Patrick Simpson
+reference: https://www.linkedin.com/in/patricksimpson/
+tags: ['Housestyle', 'Graphic Design', 'Web Development', 'Animation']
+svg: ''
+---
+Etosis is a small software consultancy and development company based in Helsinki, Finland that specialises in solving extremely complex software challenges.
+
+## Visual Identity
+
+The concept of a graphical representation of complexity was the starting point for the logo, which approximately represents the letter 'E' for etosis.
+
+Both the logo and the illustrations are drawing inspiration from wavelength graphs, since a lot of the company's products are measuring and then processing such data.
+
+## Website
+
+When it came to designing the website, the issue was that the products of etosis mostly aren't customer facing, meaning they have abstract interfaces and applications. Therefore we had no real imagery to use, and we wanted to refrain from using overly generic photos also.
+
+So I developed simplistic vector-based animations for each product that make the site interactive and interesting, even though the subject matter is rather dry.
+
+The website was built in [Eleventy](https://www.11ty.dev/), a static site generator. The animations were created as SVGs and then animated with Javascript.
+
+Live Site
\ No newline at end of file
diff --git a/src/routes/work/md/formo.md b/src/routes/work/md/formo.md
index bdf46b4..87d70a1 100644
--- a/src/routes/work/md/formo.md
+++ b/src/routes/work/md/formo.md
@@ -1,16 +1,25 @@
---
-title: Formo.bio
+title: formo.bio
header_bg_image: formo_hero_xgb6xo
+images: ['/work/formo/scrnli_screenshot_1_._k52arf', '/work/formo/scrnli_screenshot_r6cmcw', '/work/formo/scrnli_screenshot_3_._iapueq', '/work/formo/scrnli_screenshot_2_._jpypq5']
video: /work/formo/formo-rec.webm
order: 12
tags: ['tech consultancy', 'web development', 'UX Design']
-description: Formo, as you might have heard, is an international sports and lifestyle clothing brand. I worked on several digital campaigns as a graphic designer and illustrator.
+description: The future of dairy on the web
svg: ''
+reference: https://www.linkedin.com/in/ozollmanthomas/
+referenceName: Oscar Zollman
+agency: https://forpeople.com
+agencyName: forpeople
---
-## A website for the future of dairy.
+Formo is using precision fermentation instead of cows to make dairy products and save the world. Creative agency [forpeople](https://forpeople.com) is in charge of branding and brought me on board to develop a brand new website.
-Formo is using precision fermentation instead of cows to make dairy products and save the world.
+## Unlocking visual content creation
-Formo's previous website was lacking an easy way for the team to create new, visually engaging content without technical knowledge. After consulting with the team, we decided to use the latest version of WordPress which offers full support for the powerful Gutenberg editor.
+The previous website was lacking an easy way to create new, visually engaging content without technical knowledge.
-We built custom content blocks for the team to use and combine when creating new pages and articles.
\ No newline at end of file
+After consulting with the team, we decided that the comfort of the new visual editing tools of WordPress outweigh the benefits of other, more modern web frameworks, which either have data-centric approaches (and no visual editor) or require far greater effort to implement.
+
+With custom-made, React-based content blocks and the Gutenberg editor, creating new pages and articles in the new formo identity framework is now easily achievable through a WYSIWYG interface.
+
+Live site
\ No newline at end of file
diff --git a/src/routes/work/md/hatetracker.md b/src/routes/work/md/hatetracker.md
new file mode 100644
index 0000000..9d93941
--- /dev/null
+++ b/src/routes/work/md/hatetracker.md
@@ -0,0 +1,21 @@
+---
+title: Hatetracker
+description: A webapp that helped citizens report hate crimes they experienced or witnessed.
+images: ['work/hatetracker/HateTracker_app_sx7h8g', 'work/hatetracker/HateTracker_website_xf7ebd', 'work/hatetracker/HateTracker_add_e3y528']
+reference: 'https://www.linkedin.com/in/jennifereasterday/'
+referenceName: 'Jennifer Easterday'
+agency: '/work/jpl'
+agencyName: 'JustPeace Labs'
+tags: ['Branding', 'Graphic Design', 'UX Design', 'Frontend Development']
+svg: ''
+---
+This app was envisioned by peace technology organisation [JustPeace Labs](/work/jpl). I designed and developed it in collaboration with one of the founders, a [gifted engineer](https://https://sergimansilla.com/about/).
+
+It allowed anyone with an internet browser to file a report, using geo location and image/video uploads to help verify the incident.
+
+The intention was to form a template or framework that could be used and adapted by other organisations to track hate crimes in their area.
+
+## Discontinuation
+
+The app was discontinued in 2018, as no further funding was secured and local institutions were launching similar projects on their own. I like to believe that our app paved the way for these and raised awareness for its need.
+
diff --git a/src/routes/work/md/jpl.md b/src/routes/work/md/jpl.md
index 24d71ea..2ca87e0 100644
--- a/src/routes/work/md/jpl.md
+++ b/src/routes/work/md/jpl.md
@@ -1,16 +1,23 @@
---
title: JustPeace Labs
header_bg_image: jpl_hero_eukxaw
-description: JustPeace Labs is a non-profit organization that works with local communities to build peace and prevent violence.
+images: [ '/work/jpl/jpl_hero_eukxaw.jpg', '/work/jpl/website_01_zsk9oe.png', '/work/jpl/jpllogo_v7s2pl']
+description: Housestyle, website and design for the peacebuilding tech non-profit organisation.
order: 11
tags: ['branding', 'logo design', 'graphic design', 'illustration']
+tasks: ['Housestyle', 'Visual Design', 'Product Design', 'Frontend Development']
+reference: 'https://www.linkedin.com/in/jennifereasterday/'
+referenceName: 'Jennifer Easterday'
svg: ''
---
-## JPL's Mission
-The startup has declared their mission "to empower local communities to be active participants in creating lasting just peace through the use of technology". I created a logo and housestyle for them that conveyes their goals and products.
+JustPeace Labs is a non-profit organization that works with local communities to build peace and prevent violence.
-## The "broken peace" logo
-Since 1958, the Symbol for the British nuclear disarmament movement by Gerald Holtom is used as an international symbol for peace.
+## Housestyle
+I created a logo and housestyle for JustPeace Labs that conveyes their goals and products.
-Clients of JustPeace Labs are peace builders. The logo is a 'broken' peace sign with only the frame intact. It stands for the technological and ethical frameworks that JPL aims to provide that can be used to achieve long lasting, just peace.
\ No newline at end of file
+Clients of JustPeace Labs are peace builders. The logo is a 'broken' peace sign with only the frame intact. It stands for the technological and ethical frameworks that JPL aims to provide that can be used to achieve long lasting, just peace.
+
+## Projects
+
+I worked alongside the founders of the NGO and other peace building initiatives to develop communication guidelines and frameworks as well as websites and apps such as the hate crime reporting tool [Hate tracker](/work/hatetracker).
\ No newline at end of file
diff --git a/src/routes/work/md/letshost.md b/src/routes/work/md/letshost.md
new file mode 100644
index 0000000..f37342f
--- /dev/null
+++ b/src/routes/work/md/letshost.md
@@ -0,0 +1,12 @@
+---
+title: Letshost.ie
+description: Design and development for the irish hosting provider
+images: ['work/letshost/letshost_hero_ibd4sx', 'work/letshost/letshost_sharedhosting_desktop_sriv5t', 'work/letshost/letshost_testimonials_desktop_ijwxmy', 'work/letshost/letshost_wordpress_desktop_qaknlm']
+tags: ['Graphc Design', 'Web Design', 'Frontend Development']
+reference: https://www.linkedin.com/in/daraghmacloughlin/
+referenceName: Daragh Mac Loughlin
+svg: ''
+---
+LetsHost.ie is the leading irish webhosting provider. I worked with the marketing team to redesign their website and improve their user journeys.
+
+Their best selling product are WordPress hosting packages. So in order to really practice what they preach and showcase what is possible in terms of performance and design, their own website also runs on the same stack.
\ No newline at end of file
diff --git a/src/routes/work/md/peak.md b/src/routes/work/md/peak.md
index 017a53c..a83e303 100644
--- a/src/routes/work/md/peak.md
+++ b/src/routes/work/md/peak.md
@@ -1,9 +1,18 @@
---
title: peak.capital
header_bg_image: peak_hero_ewp1wb
+images: ['/work/peak/peak-mobile-mockup_wtp3ea', '/work/peak/peak_hero_ewp1wb']
order: 12
-description: Peak Capital description
-tags: ['early-stage investment fund', 'venture capital', 'fund', 'investor']
-svg: ''
+description: A new website for the european investment fund
+tags: ['Webdesign', 'Frontend Development']
+svg: ''
+referenceName: Madeline Lawrence
+reference: https://www.linkedin.com/in/madelinelawren/
---
-Peak is an early-stage investment fund backed by entrepreneurs in Europe.
\ No newline at end of file
+Peak is an early-stage investment fund backed by entrepreneurs in Europe.
+
+In 2021 the creative agency [forpeople](https://forpeople.com) helped Peak with a full rebranding. They brought me on board to help translate the new branding to the company's exist ing WordPress website.
+
+Over the past years I have worked with the team at peak to develop the site further.
+
+Live site
\ No newline at end of file
diff --git a/src/routes/work/md/uncommon.md b/src/routes/work/md/uncommon.md
index ac9f7b5..688c345 100644
--- a/src/routes/work/md/uncommon.md
+++ b/src/routes/work/md/uncommon.md
@@ -1,10 +1,20 @@
---
-title: Uncommonbio.co
+title: uncommonbio.co
header_bg_image: uncommon_hero_jf1in9
+images: ['work/uncommon/uncommon_hero_jf1in9', 'work/uncommon/scrnli_Oct_10_2023_sspigq', 'work/uncommon/scrnli_screenshot_4_._dctvo7', 'work/uncommon/scrnli_Oct_10_2023_1_._ybvayx']
order: 12
-tags: ['tech consultancy', 'web development', 'UX Design', 'Knoterputer', 'Henkenstein']
-description: Peak Capital description
+tags: ['Tech consultancy', 'Frontend development',]
+description: A brand-new website for the home of animal-free bacon
+reference: https://www.linkedin.com/in/patrick-niall-38560b1b/
+referenceName: Patrick Niall
+agency: https://forpeople.com
+agencyName: forpeople
svg: ''
---
-Uncommon's mission is to sell rashers and rashers of cultivated pork at price parity.
-For happy pigs and piggy banks.
\ No newline at end of file
+Uncommon's mission is to sell rashers and rashers of cultivated pork at price parity. For happy pigs and piggy banks.
+
+Another project in collaboration with the ever-inspiring creative agency [forpeople](https://forpeople.com). Their client Uncommon needed a website to go along with their new brand name and identity.
+
+Unique features include an option to have your website browsing pleasure be accompanied by the sound of bacon sizzling in a pan and a page that explains the science of the product that adapts to your knowledge level.
+
+Check it out live
\ No newline at end of file
diff --git a/src/routes/work/old+page.svelte b/src/routes/work/old+page.svelte
new file mode 100644
index 0000000..0e49139
--- /dev/null
+++ b/src/routes/work/old+page.svelte
@@ -0,0 +1,71 @@
+
+