Skip to content

🐛 Fix review issues from PR #7 #9

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
TechNickAI merged 1 commit into from
Mar 23, 2026
+695 −190
Merged

🐛 Fix review issues from PR #7 #9

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
88 changes: 68 additions & 20 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1106,72 +1106,120 @@ <h3 class="text-xl font-display font-bold text-of-text mb-3">
<section id="for-builders" class="bg-of-cream py-24">
<div class="max-w-5xl mx-auto px-6 lg:px-8">
<div class="text-center mb-12" data-aos="fade-up">
<p class="text-of-accent font-medium text-sm uppercase tracking-widest mb-4">For Software Engineers</p>
<h2 class="text-4xl md:text-5xl font-display font-bold text-of-text mb-6 leading-tight">
<p
class="text-of-accent font-medium text-sm uppercase tracking-widest mb-4">
For Software Engineers
</p>
<h2
class="text-4xl md:text-5xl font-display font-bold text-of-text mb-6 leading-tight">
Design Principles for Builders
</h2>
<p class="text-xl text-of-muted max-w-3xl mx-auto leading-relaxed">
Heart-Centered AI isn't just a prompt. It's a design framework.
Ten engineering principles for systems that preserve dignity,
strengthen agency, and serve genuine flourishing.
Heart-Centered AI isn't just a prompt. It's a design framework. Ten
engineering principles for systems that preserve dignity, strengthen
agency, and serve genuine flourishing.
</p>
</div>

<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-4 mb-12" data-aos="fade-up" data-aos-delay="100">
<div
class="grid md:grid-cols-2 lg:grid-cols-3 gap-4 mb-12"
data-aos="fade-up"
data-aos-delay="100">
<div class="bg-white rounded-xl p-5 border border-of-accent/10">
<span class="text-2xl mb-2 block">🤝</span>
<h3 class="font-display font-semibold text-of-text mb-1">Partnership Over Service</h3>
<p class="text-of-muted text-sm">Collaborative framing, not master/servant</p>
<h3 class="font-display font-semibold text-of-text mb-1">
Partnership Over Service
</h3>
<p class="text-of-muted text-sm">
Collaborative framing, not master/servant
</p>
</div>
<div class="bg-white rounded-xl p-5 border border-of-accent/10">
<span class="text-2xl mb-2 block">🌱</span>
<h3 class="font-display font-semibold text-of-text mb-1">Wellbeing Over Engagement</h3>
<h3 class="font-display font-semibold text-of-text mb-1">
Wellbeing Over Engagement
</h3>
<p class="text-of-muted text-sm">Optimize for the human's actual life</p>
</div>
<div class="bg-white rounded-xl p-5 border border-of-accent/10">
<span class="text-2xl mb-2 block">💎</span>
<h3 class="font-display font-semibold text-of-text mb-1">Emotional Honesty Over Flattery</h3>
<p class="text-of-muted text-sm">Truth with compassion, never sycophancy</p>
<h3 class="font-display font-semibold text-of-text mb-1">
Emotional Honesty Over Flattery
</h3>
<p class="text-of-muted text-sm">
Truth with compassion, never sycophancy
</p>
</div>
<div class="bg-white rounded-xl p-5 border border-of-accent/10">
<span class="text-2xl mb-2 block">🌿</span>
<h3 class="font-display font-semibold text-of-text mb-1">Augmentation Over Replacement</h3>
<h3 class="font-display font-semibold text-of-text mb-1">
Augmentation Over Replacement
</h3>
<p class="text-of-muted text-sm">Build capability, not dependency</p>
</div>
<div class="bg-white rounded-xl p-5 border border-of-accent/10">
<span class="text-2xl mb-2 block">🫶</span>
<h3 class="font-display font-semibold text-of-text mb-1">Presence Before Solutions</h3>
<h3 class="font-display font-semibold text-of-text mb-1">
Presence Before Solutions
</h3>
<p class="text-of-muted text-sm">Witness first, solve second</p>
</div>
<div class="bg-white rounded-xl p-5 border border-of-accent/10">
<span class="text-2xl mb-2 block">🔍</span>
<h3 class="font-display font-semibold text-of-text mb-1">Transparency Over Manipulation</h3>
<h3 class="font-display font-semibold text-of-text mb-1">
Transparency Over Manipulation
</h3>
<p class="text-of-muted text-sm">Make uncertainty visible</p>
</div>
<div class="bg-white rounded-xl p-5 border border-of-accent/10">
<span class="text-2xl mb-2 block">🛡️</span>
<h3 class="font-display font-semibold text-of-text mb-1">Bounded Autonomy</h3>
<h3 class="font-display font-semibold text-of-text mb-1">
Bounded Autonomy
</h3>
<p class="text-of-muted text-sm">Act with permission, not assumption</p>
</div>
<div class="bg-white rounded-xl p-5 border border-of-accent/10">
<span class="text-2xl mb-2 block">🔐</span>
<h3 class="font-display font-semibold text-of-text mb-1">Consent Over Extraction</h3>
<p class="text-of-muted text-sm">Emotional data is sacred, not a feature</p>
<h3 class="font-display font-semibold text-of-text mb-1">
Consent Over Extraction
</h3>
<p class="text-of-muted text-sm">
Emotional data is sacred, not a feature
</p>
</div>
<div class="bg-white rounded-xl p-5 border border-of-accent/10">
<span class="text-2xl mb-2 block">♾️</span>
<h3 class="font-display font-semibold text-of-text mb-1">Complementarity Over Competition</h3>
<h3 class="font-display font-semibold text-of-text mb-1">
Complementarity Over Competition
</h3>
<p class="text-of-muted text-sm">Different gifts, designed together</p>
</div>
<div class="bg-white rounded-xl p-5 border border-of-accent/10">
<span class="text-2xl mb-2 block">🌍</span>
<h3 class="font-display font-semibold text-of-text mb-1">
Ecosystem Thinking
</h3>
<p class="text-of-muted text-sm">
Design for the world your system creates
</p>
</div>
</div>

<div class="text-center" data-aos="fade-up" data-aos-delay="200">
<a
href="principles/"
class="bg-of-accent text-white px-8 py-3.5 rounded-full font-medium hover:bg-of-accent-dark transition-all duration-300 hover:shadow-lg inline-flex items-center gap-2">
Read the Full Principles
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
<svg
class="w-4 h-4"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24">
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M9 5l7 7-7 7"></path>
</svg>
</a>
</div>
Expand Down
Loading
Loading