Update project and design work info

Author: GRA0007

app/page.tsx

@@ -2,8 +2,8 @@ import { DesignWork } from '/components/DesignWork'
 import { Eyes } from '/components/Eyes'
 import { ProjectCard } from '/components/ProjectCard'
 import { Socials } from '/components/Socials'
-import { DESIGNWORK } from '/res/designwork'
 import { PROJECTS } from '/res/projects'
+import { DESIGNWORK } from '../res/design'
 import { AllProjects } from './projects'
 
 const projectCards = PROJECTS.map((project) => <ProjectCard key={project.name} {...project} />)

components/DesignWork/index.tsx

@@ -1,4 +1,4 @@
-import type { DesignWork as DesignWorkProps } from '/res/designwork'
+import type { DesignWork as DesignWorkProps } from '../../res/design'
 
 export const DesignWork = ({ name, imageURL, href }: DesignWorkProps) => {
   return (

res/designwork.ts renamed to res/design.ts

@@ -1,28 +1,29 @@
 export interface DesignWork {
   name: string
-  imageURL: string
+  /** The filename in the s3 bucket located at `Portfolio/Design Work` */
+  image: string
   href: string
 }
 
 export const DESIGNWORK: DesignWork[] = [
   {
     name: 'Monash Society for Physics, Astro & Maths Brand Redesign',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/spam_logo.webp',
+    image: 'spam_logo.webp',
     href: 'https://www.notion.so/Monash-Society-for-Physics-Astro-and-Maths-Brand-Redesign-55b1481c1250486396a76ab14f0ef2b6',
   },
   {
     name: 'RMIT Blockchain Club Logo Redesign',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/blockchain_club.webp',
+    image: 'blockchain_club.webp',
     href: 'https://www.notion.so/RMIT-Blockchain-Club-logo-redesign-32290780185c430aa06e3422686843c6',
   },
   {
     name: 'RMIT Technology Coalition Logo Redesign',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/tech_coalition.webp',
+    image: 'tech_coalition.webp',
     href: 'https://www.notion.so/RMIT-Technology-Coalition-logo-redesign-07546105c8ce4ae09c7365ec80668a57',
   },
   {
     name: 'RMIT CSIT Society Brand Redesign',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/csit.webp',
+    image: 'csit.webp',
     href: 'https://www.notion.so/RMIT-CSIT-Society-brand-redesign-e3fb846876cf4cc5a83501b5f107dabe',
   },
 ]

res/projects.ts

@@ -1,7 +1,11 @@
 export interface Project {
   name: string
   description: string
-  imageURL: string
+  image: {
+    /** The filename in the s3 bucket located at `Portfolio/Projects` */
+    src: string
+    alt: string
+  }
   href: string
 }
 
@@ -11,105 +15,156 @@ export const PROJECTS: Project[] = [
   {
     name: 'Crab Fit',
     description: 'A modern event planning website',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/crabfit.webp',
+    image: {
+      src: 'crabfit.webp',
+      alt: 'Screenshot of the Crab Fit website showing a heatmap of availabilities',
+    },
     href: 'https://crab.fit',
   },
   {
     name: 'Stevent',
     description: 'Community event platform',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/stevent.webp',
+    image: {
+      src: 'stevent.webp',
+      alt: 'Screenshot of the Stevent events page with several university events visible',
+    },
     href: 'https://stevent.club',
   },
   {
     name: 'Automatarium',
     description: 'Build and simulate complex automata in your browser',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/automatarium.webp',
+    image: {
+      src: 'automatarium.webp',
+      alt: 'Screenshot of the Automatarium editor with a sidepanel that reads "Testing Lab"',
+    },
     href: 'https://automatarium.tdib.xyz/',
   },
   {
     name: 'Flour - Baker’s Companion',
     description: 'Android and iOS app with baking tools',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/flour.webp',
+    image: {
+      src: 'flour.webp',
+      alt: 'Several screenshots of the Flour app showing its various features like quantity converter, substitutions, etc.',
+    },
     href: 'https://play.google.com/store/apps/details?id=benpai.flour',
   },
 
   // More projects
   {
     name: 'Era',
     description: 'Simply beautiful countdown timers',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/era.webp',
+    image: {
+      src: 'era.webp',
+      alt: 'Screenshot of the Era website showing several countdown timers',
+    },
     href: 'https://era-timers.netlify.app/',
   },
   {
     name: 'Hyper Colors',
     description: 'Every named CSS color at your fingertips',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/hyper_colors.webp',
+    image: {
+      src: 'hyper_colors.webp',
+      alt: 'A screenshot of a grid of HTML colors and their hex codes with the caption "Find colors from any tab with the Hyper Colors extension"',
+    },
     href: 'https://chrome.google.com/webstore/detail/hyper-colors/ogefbnmdhjekmihajflilhhcjpkjmppc',
   },
   {
     name: 'Our Saviour Popcat',
     description: 'A tribute to the cat of legend',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/popcat.webp',
+    image: {
+      src: 'popcat.webp',
+      alt: 'An image of the popcat meme with text above that reads "Our Saviour Popcat has descended from the heavens to help us find our path and wholesome ways"',
+    },
     href: 'https://popcat.faith',
   },
   {
     name: 'Maimai Song List',
     description: 'Browse songs from the popular rhythm game',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/maimai_song_list.webp',
+    image: {
+      src: 'maimai_song_list.webp',
+      alt: 'A list of several songs with their jacket images, and metadata about them',
+    },
     href: 'https://otohime.rocks',
   },
   {
     name: 'Emoji Menu',
-    description: 'A catalogue of Google\'s Emoji Kitchen',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/emoji_menu.webp',
+    description: "A catalogue of Google's Emoji Kitchen",
+    image: {
+      src: 'emoji_menu.webp',
+      alt: 'Screenshot of the Emoji Menu site with a search field and several emoji mashups',
+    },
     href: 'https://emojikitchen.rocks',
   },
   {
     name: 'Modern Calendar Embed',
     description: 'Embed any iCal on a website beautifully',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/modern_cal_embed.webp',
+    image: {
+      src: 'modern_cal_embed.webp',
+      alt: 'Screenshot of several events in an agenda view with the title "Test Calendar"',
+    },
     href: 'https://github.com/GRA0007/modern-cal-embed',
   },
   {
     name: 'Spectrum Tab Page',
     description: 'A colourful new tab page',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/spectrum_tab_page.webp',
+    image: {
+      src: 'spectrum_tab_page.webp',
+      alt: 'A blue-green gradient with a simplified browser tab interface',
+    },
     href: 'https://addons.mozilla.org/en-US/firefox/addon/spectrum-tab-page/',
   },
   {
     name: 'Pixel Display',
     description: 'Tiny JavaScript library for pixels',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/pixel_display.webp',
+    image: {
+      src: 'pixel_display.webp',
+      alt: 'Screenshot of the test page with several buttons and inputs with the title "Pixel Display Library"',
+    },
     href: 'https://github.com/GRA0007/pixel-display',
   },
   {
     name: 'Cookie Cat',
     description: 'A Steven Universe inspired Discord bot',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/cookie_cat.webp',
+    image: {
+      src: 'cookie_cat.webp',
+      alt: 'A large ice-cream sandwich graphic shaped like a cat, with the words "Cookie Cat" below, and a button that reads "Add Cookie Cat to your server"',
+    },
     href: 'https://gra0007.github.io/cookiecat-website/',
   },
   {
     name: 'Kaneda',
     description: 'A helpful Discord bot',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/kaneda.webp',
+    image: {
+      src: 'kaneda.webp',
+      alt: 'A Discord message from the Kaneda bot with information about itself',
+    },
     href: 'https://github.com/GRA0007/kaneda-website',
   },
   {
     name: 'Folder Icon Generator',
     description: 'Generate icons for your media folders',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/folder_icon_generator.webp',
+    image: {
+      src: 'folder_icon_generator.webp',
+      alt: 'Screenshot of a Windows file explorer window with folder icons that have little anime cover images in them',
+    },
     href: 'https://github.com/GRA0007/Folder-Icon-Generator',
   },
   {
     name: 'Blue',
     description: 'Enhanced Scratch 2.0 mod',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/blue.webp',
+    image: {
+      src: 'blue.webp',
+      alt: 'A list of new Scratch blocks, with comments about their functionality',
+    },
     href: 'https://github.com/GRA0007/Blue',
   },
   {
     name: 'MAL Client for Pebble',
     description: 'Manage your anime list from your watch',
-    imageURL: 'https://storage.googleapis.com/personal-site-cdn/mal_client_for_pebble.webp',
+    image: {
+      src: 'mal_client_for_pebble.webp',
+      alt: 'A stylised Pebble smartwatch displaying the app, with a title that reads "MyAnimeList Client"',
+    },
     href: 'https://github.com/GRA0007/MAL-Client',
   },
 ]