Joakim
fb7df5a5c5
- Replace minified scraped HTML with clean, readable portfolio demo - Remove all Next.js assets and dependencies (_next/, fonts, images) - Create hand-crafted HTML with proper structure and modern CSS - Maintain portfolio theme with projects, timeline, and professional content - Reduce from 30KB minified to 6KB clean, readable HTML - Update README to reflect new clean demo purpose
180 lines
6.1 KiB
HTML
180 lines
6.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Daniel Eden, Designer - Portfolio Demo</title>
|
|
<style>
|
|
body {
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
line-height: 1.6;
|
|
margin: 0;
|
|
padding: 0;
|
|
color: #333;
|
|
background: #f9f9f9;
|
|
}
|
|
.container {
|
|
max-width: 800px;
|
|
margin: 0 auto;
|
|
padding: 2rem;
|
|
}
|
|
header {
|
|
text-align: center;
|
|
margin-bottom: 3rem;
|
|
padding: 2rem;
|
|
background: white;
|
|
border-radius: 8px;
|
|
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
|
|
}
|
|
.intro {
|
|
font-size: 1.1rem;
|
|
color: #666;
|
|
margin-bottom: 2rem;
|
|
}
|
|
.projects {
|
|
display: grid;
|
|
gap: 2rem;
|
|
margin-bottom: 3rem;
|
|
}
|
|
.project {
|
|
background: white;
|
|
padding: 2rem;
|
|
border-radius: 8px;
|
|
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
|
|
}
|
|
.project h3 {
|
|
margin-top: 0;
|
|
color: #2563eb;
|
|
}
|
|
.timeline {
|
|
background: white;
|
|
padding: 2rem;
|
|
border-radius: 8px;
|
|
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
|
|
}
|
|
.timeline-item {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
padding: 1rem 0;
|
|
border-bottom: 1px solid #eee;
|
|
}
|
|
.timeline-item:last-child {
|
|
border-bottom: none;
|
|
}
|
|
.year {
|
|
font-weight: bold;
|
|
color: #666;
|
|
min-width: 60px;
|
|
}
|
|
.event {
|
|
flex: 1;
|
|
margin-left: 2rem;
|
|
}
|
|
.event a {
|
|
color: #2563eb;
|
|
text-decoration: none;
|
|
}
|
|
.event a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
.meta {
|
|
font-size: 0.9rem;
|
|
color: #888;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<header>
|
|
<h1>Daniel Eden, Designer</h1>
|
|
<p class="intro">A Product Designer at Meta Reality Labs, working on Avatars & Identity, helping people express their full selves in the Metaverse. Passionate about Design Systems: how they scale, how they break, and the people that maintain them.</p>
|
|
</header>
|
|
|
|
<section class="projects">
|
|
<div class="project">
|
|
<h3>Ora</h3>
|
|
<p>An app about time for iPhone, iPad, and Apple Watch. Clean, minimal interface for tracking time zones and world clocks.</p>
|
|
<a href="https://ora.daneden.me">Learn more →</a>
|
|
</div>
|
|
|
|
<div class="project">
|
|
<h3>Solstice</h3>
|
|
<p>An app about daylight for iPhone, iPad, Mac, Apple Watch, and Apple Vision Pro. Beautiful visualizations of sunrise, sunset, and daylight hours.</p>
|
|
<a href="https://apps.apple.com/app/solstice/id1547580907">Learn more →</a>
|
|
</div>
|
|
|
|
<div class="project">
|
|
<h3>Where We Can Go</h3>
|
|
<p>A conference talk and essay about design systems and design tools. Exploring the future of design tooling and systematic design.</p>
|
|
<a href="https://daneden.me/blog/2019/where-we-can-go">Read the post →</a>
|
|
</div>
|
|
|
|
<div class="project">
|
|
<h3>Zeitgeist</h3>
|
|
<p>An app for Vercel developers for iPhone, iPad, and Mac. Monitor deployments, manage projects, and stay connected to your development workflow.</p>
|
|
<a href="https://apps.apple.com/app/zeitgeist/id1526052028">Learn more →</a>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="timeline">
|
|
<h2>Timeline</h2>
|
|
|
|
<div class="timeline-item">
|
|
<div class="year">2025</div>
|
|
<div class="event">
|
|
<a href="https://ora.daneden.me">Ora</a>
|
|
<div class="meta">iOS App</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="timeline-item">
|
|
<div class="year">2021</div>
|
|
<div class="event">
|
|
<a href="https://apps.apple.com/app/solstice/id1547580907">Solstice</a>
|
|
<div class="meta">iOS App</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="timeline-item">
|
|
<div class="year"></div>
|
|
<div class="event">
|
|
<a href="https://apps.apple.com/gb/app/broadcast-just-tweet/id1574084018">Broadcast</a>
|
|
<div class="meta">iOS App</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="timeline-item">
|
|
<div class="year">2020</div>
|
|
<div class="event">
|
|
<a href="https://apps.apple.com/app/eventually/id1532457758">Eventually</a>
|
|
<div class="meta">iOS App</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="timeline-item">
|
|
<div class="year"></div>
|
|
<div class="event">
|
|
<a href="https://apps.apple.com/app/zeitgeist/id1526052028">Zeitgeist</a>
|
|
<div class="meta">iOS App</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="timeline-item">
|
|
<div class="year">2019</div>
|
|
<div class="event">
|
|
<a href="https://www.clarityconf.com/session/where-we-can-go">Clarity 2019</a>
|
|
<div class="meta">"Where We Can Go"</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="timeline-item">
|
|
<div class="year">2018</div>
|
|
<div class="event">
|
|
<a href="https://www.loversmagazine.com/interviews/daniel-eden">Lovers Magazine</a>
|
|
<div class="meta">Interview</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</body>
|
|
</html> |