Web Design · Content Hubs · 2023–2025
Video Series
Web design and front-end development for a video content hub, built in-house at DigiKey.
Designing and coding video-series websites from page structure to final launch.
I designed and built the web experiences for DigiKey’s original video series from start to finish. I organized the content, planned reusable page patterns, wrote the HTML and CSS, tested the layouts across screen sizes, and carried the work through to the final live pages for Factory Tomorrow, City Digital, and Farm Different.
- Client
- DigiKey Electronics
- My role
- Web design and front-end development — HTML & CSS
- Key expertise
- Page design & content structure · HTML development · CSS & responsive development · Series hero art direction · Season navigation pattern · Episode list templates · Sponsor placement system · Cross-device testing
DigiKey’s original video series explore technology shaping manufacturing, cities, and agriculture. I took each web experience from organized content and layout decisions through hands-on HTML and CSS development, then into its final live form on digikey.com.
The assignment
Create a home for stories, not just a list of videos
Each series contained multiple seasons, sponsors, summaries, and embedded episodes inside DigiKey's existing website. I owned the web work from start to finish: deciding how the content should flow, designing the page system, building it in code, and refining the result until it was ready to launch.
Page architecture
Build the reading order before styling the page
I organized the experience around the questions a viewer would naturally ask: What is this series? Which season am I viewing? Who is involved? What should I watch next? That became a repeatable structure of introduction, season navigation, sponsor context, and episode modules that could grow without requiring a new layout every time.
HTML development
Turn the content model into a working page
I wrote the HTML that gives the page its structure: season tabs, sponsor-logo groups, text blocks, embedded video players, episode headings, and summaries. I used consistent class patterns so each new episode could be added predictably and the same foundation could support every series.
CSS development
Create the visual system and responsive behavior
With the structure working, I wrote the CSS for typography, spacing, image treatment, content cards, logo grids, alternating rows, and calls to action. I also added breakpoints that change widths and stacking behavior for tablets and phones. The screenshots show the actual layout rules and reusable patterns I built, not a handoff to someone else.
Testing and refinement
Make one foundation work across content and screens
I checked how long summaries, sponsor combinations, image proportions, and growing episode lists behaved at different sizes. I adjusted the layout rather than forcing every page into one rigid composition, keeping the viewing experience consistent while allowing Factory Tomorrow, City Digital, and Farm Different to keep their own visual identities.
Final webpages
From working code to live series hubs
The finished pages are the result of the complete process: content organization, experience design, HTML structure, CSS styling, responsive refinement, and launch. Together they demonstrate how I approach web design as both a visual designer and a hands-on builder.
Next project · 2024–2025
Global Campaigns
Campaign Creative · Art Direction