Skip to content

Commit 7e57328

Browse files
mostlyerrorclaude
mostlyerror
and
claude
authored
Add transparent pricing page with accessible rates (#12)
* Add hero illustration and enhance CTA buttons - Add robot illustration positioned above CTAs on mobile, larger on desktop - Increase CTA button size (px-8 py-4) and font weight (bold, text-lg) - Add prominent shadow effects to CTAs with coral glow on primary button - Reposition decorative elements to left side to accommodate illustration - Hide some decorative elements on mobile/tablet for cleaner layout Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com> * Add transparent pricing page with accessible rates Added a new /pricing page with three simplified tiers and honest messaging about being early-stage. Updated homepage messaging to be transparent about building the practice while maintaining confidence and professionalism. Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com> --------- Co-authored-by: Claude Sonnet 4.5 <noreply@anthropic.com>
1 parent 0d44dc0 commit 7e57328

5 files changed

Lines changed: 256 additions & 8 deletions

File tree

‎app/page.tsx‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -108,9 +108,9 @@ export default function Home() {
108108
&quot;The best solution is usually simpler than you think.&quot;
109109
</p>
110110
<div className="space-y-4 text-charcoal-light mb-8">
111-
<p>Most tech consultants default to building something complex. I take a different approach: I find the solution that fits your problem, your budget, and your team.</p>
112-
<p>Sometimes that&apos;s a simple automation or an off-the-shelf tool. Sometimes it&apos;s custom software built exactly for your needs. The difference is I&apos;ll always tell you which one makes sense and why.</p>
113-
<p>No unnecessary complexity. No overselling. Just the right solution for where you are and where your business is going.</p>
111+
<p>I&apos;m building my consulting practice and keeping things simple. I focus on finding the solution that fits your problem and budget—whether that&apos;s a quick automation, a simple website, or custom development.</p>
112+
<p>I won&apos;t overcomplicate things or sell you services you don&apos;t need. You&apos;ll get honest advice, fair pricing, and quality work.</p>
113+
<p>I&apos;m transparent about where I am: building my portfolio with real client projects. That means accessible pricing and personalized attention.</p>
114114
</div>
115115
<div className="flex items-center gap-3">
116116
<img
@@ -207,7 +207,7 @@ export default function Home() {
207207
<div className="max-w-6xl mx-auto px-6">
208208
<div className="max-w-[550px] mb-12">
209209
<h2 className="text-3xl md:text-4xl font-semibold mb-3.5">Why work with me?</h2>
210-
<p className="text-lg text-charcoal-light">I&apos;m not a huge agency. You&apos;ll work directly with a senior technologist who understands your business—no account managers, no junior staff, no runaround.</p>
210+
<p className="text-lg text-charcoal-light">You&apos;ll work directly with me—no account managers, no runaround. I&apos;m building my practice and keeping things personal and affordable.</p>
211211
</div>
212212

213213
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
@@ -227,9 +227,9 @@ export default function Home() {
227227
<p className="text-charcoal-light text-[15px]">I answer emails. I show up to calls. You&apos;ll never wonder where your project stands.</p>
228228
</div>
229229
<div className="p-4">
230-
<div className="w-16 h-16 bg-sky-light rounded-2xl flex items-center justify-center text-2xl mb-5">🔧</div>
231-
<h3 className="text-xl font-semibold mb-2.5">Built to Last</h3>
232-
<p className="text-charcoal-light text-[15px]">No fragile systems that break when I&apos;m not around. Everything I deliver is maintainable and documented.</p>
230+
<div className="w-16 h-16 bg-sky-light rounded-2xl flex items-center justify-center text-2xl mb-5">💰</div>
231+
<h3 className="text-xl font-semibold mb-2.5">Fair Pricing</h3>
232+
<p className="text-charcoal-light text-[15px]">I&apos;m building my portfolio, so my rates are accessible. You get quality work without the agency markup.</p>
233233
</div>
234234
</div>
235235
</div>

‎app/pricing/page.tsx‎

Lines changed: 245 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,245 @@
1+
import { Metadata } from 'next'
2+
import HeroSimple from '@/components/HeroSimple'
3+
import CTA from '@/components/CTA'
4+
5+
export const metadata: Metadata = {
6+
title: 'Pricing | Good Robot Co.',
7+
description: 'Transparent pricing for tech consulting, AI integration, custom development, and ongoing support. Solutions sized for small and mid-size businesses.',
8+
openGraph: {
9+
title: 'Pricing | Good Robot Co.',
10+
description: 'Transparent pricing for tech consulting, AI integration, custom development, and ongoing support. Solutions sized for small and mid-size businesses.',
11+
url: 'https://goodrobotco.com/pricing',
12+
type: 'website',
13+
images: [
14+
{
15+
url: '/og-image.png',
16+
width: 1200,
17+
height: 630,
18+
alt: 'Good Robot Co. Pricing',
19+
},
20+
],
21+
},
22+
twitter: {
23+
card: 'summary_large_image',
24+
title: 'Pricing | Good Robot Co.',
25+
description: 'Transparent pricing for tech consulting, AI integration, custom development, and ongoing support. Solutions sized for small and mid-size businesses.',
26+
images: ['/og-image.png'],
27+
},
28+
}
29+
30+
export default function Pricing() {
31+
return (
32+
<>
33+
<HeroSimple
34+
title="Transparent Pricing"
35+
subtitle="No hidden fees, no surprise invoices. Here's what you can expect to invest when working with Good Robot Co."
36+
/>
37+
38+
{/* Pricing Philosophy */}
39+
<section className="py-16 bg-white">
40+
<div className="max-w-3xl mx-auto px-6">
41+
<div className="border-l-4 border-coral pl-8">
42+
<h2 className="text-2xl font-semibold mb-4">Simple, straightforward pricing</h2>
43+
<div className="space-y-4 text-charcoal-light mb-6">
44+
<p>I keep pricing simple and accessible for small businesses. You know exactly what you&apos;re paying, and there are no hidden fees or surprise invoices.</p>
45+
<p>Every project includes planning, regular updates, and support after launch. If something&apos;s not clear, I&apos;ll explain it in plain English.</p>
46+
</div>
47+
<div>
48+
<p className="text-charcoal mb-4">Not sure which option fits? <a
49+
href="#contact"
50+
className="relative inline-block font-semibold text-coral hover:text-coral-hover transition-colors group"
51+
>
52+
Book a free call
53+
<svg className="absolute -bottom-1 left-0 w-full" viewBox="0 0 200 8" preserveAspectRatio="none">
54+
<path
55+
d="M0,5 Q5,3 10,5 T20,5 T30,5 T40,5 T50,5 T60,5 T70,5 T80,5 T90,5 T100,5 T110,5 T120,5 T130,5 T140,5 T150,5 T160,5 T170,5 T180,5 T190,5 T200,5"
56+
stroke="currentColor"
57+
strokeWidth="2"
58+
fill="none"
59+
className="text-coral"
60+
/>
61+
</svg>
62+
</a></p>
63+
</div>
64+
</div>
65+
</div>
66+
</section>
67+
68+
{/* Main Pricing Tiers */}
69+
<section className="py-20 bg-cream">
70+
<div className="max-w-5xl mx-auto px-6">
71+
<h2 className="text-3xl font-semibold mb-12 text-center">Three Simple Options</h2>
72+
73+
<div className="grid md:grid-cols-3 gap-8">
74+
75+
{/* Small Projects */}
76+
<div className="bg-white rounded-2xl p-8 shadow-md hover:shadow-xl hover:-translate-y-2 transition-all duration-300">
77+
<div className="w-16 h-16 bg-sage-light rounded-2xl flex items-center justify-center text-3xl mb-6">⚡</div>
78+
<h3 className="text-2xl font-semibold mb-2">Small Projects</h3>
79+
<div className="mb-6">
80+
<span className="text-4xl font-bold text-charcoal">$1,500</span>
81+
<span className="text-charcoal-light"> – $3,000</span>
82+
</div>
83+
<p className="text-charcoal-light mb-6">Perfect for quick wins and getting started.</p>
84+
85+
<div className="space-y-3 mb-8">
86+
<p className="text-sm font-semibold text-charcoal mb-3">Good for:</p>
87+
<div className="flex gap-2 items-start">
88+
<span className="text-sage flex-shrink-0 mt-0.5">✓</span>
89+
<span className="text-sm text-charcoal-light">Simple websites (Squarespace, Webflow)</span>
90+
</div>
91+
<div className="flex gap-2 items-start">
92+
<span className="text-sage flex-shrink-0 mt-0.5">✓</span>
93+
<span className="text-sm text-charcoal-light">Basic automations (Zapier, Make)</span>
94+
</div>
95+
<div className="flex gap-2 items-start">
96+
<span className="text-sage flex-shrink-0 mt-0.5">✓</span>
97+
<span className="text-sm text-charcoal-light">Quick fixes and improvements</span>
98+
</div>
99+
<div className="flex gap-2 items-start">
100+
<span className="text-sage flex-shrink-0 mt-0.5">✓</span>
101+
<span className="text-sm text-charcoal-light">Tech consultation and planning</span>
102+
</div>
103+
</div>
104+
105+
<p className="text-sm text-charcoal-light italic">Timeline: 1-2 weeks</p>
106+
</div>
107+
108+
{/* Medium Projects */}
109+
<div className="bg-white rounded-2xl p-8 shadow-md hover:shadow-xl hover:-translate-y-2 transition-all duration-300 border-2 border-coral">
110+
<div className="inline-block px-3 py-1 bg-coral text-white text-xs font-semibold rounded-full mb-4">Most Common</div>
111+
<div className="w-16 h-16 bg-coral/10 rounded-2xl flex items-center justify-center text-3xl mb-6">🛠️</div>
112+
<h3 className="text-2xl font-semibold mb-2">Medium Projects</h3>
113+
<div className="mb-6">
114+
<span className="text-4xl font-bold text-charcoal">$3,000</span>
115+
<span className="text-charcoal-light"> – $6,000</span>
116+
</div>
117+
<p className="text-charcoal-light mb-6">Custom builds and integrations that make a real impact.</p>
118+
119+
<div className="space-y-3 mb-8">
120+
<p className="text-sm font-semibold text-charcoal mb-3">Good for:</p>
121+
<div className="flex gap-2 items-start">
122+
<span className="text-sage flex-shrink-0 mt-0.5">✓</span>
123+
<span className="text-sm text-charcoal-light">Custom websites with CMS</span>
124+
</div>
125+
<div className="flex gap-2 items-start">
126+
<span className="text-sage flex-shrink-0 mt-0.5">✓</span>
127+
<span className="text-sm text-charcoal-light">AI chatbots and assistants</span>
128+
</div>
129+
<div className="flex gap-2 items-start">
130+
<span className="text-sage flex-shrink-0 mt-0.5">✓</span>
131+
<span className="text-sm text-charcoal-light">Process automation workflows</span>
132+
</div>
133+
<div className="flex gap-2 items-start">
134+
<span className="text-sage flex-shrink-0 mt-0.5">✓</span>
135+
<span className="text-sm text-charcoal-light">Simple web apps and tools</span>
136+
</div>
137+
</div>
138+
139+
<p className="text-sm text-charcoal-light italic">Timeline: 3-5 weeks</p>
140+
</div>
141+
142+
{/* Ongoing Support */}
143+
<div className="bg-white rounded-2xl p-8 shadow-md hover:shadow-xl hover:-translate-y-2 transition-all duration-300">
144+
<div className="w-16 h-16 bg-lavender-light rounded-2xl flex items-center justify-center text-3xl mb-6">🤝</div>
145+
<h3 className="text-2xl font-semibold mb-2">Ongoing Support</h3>
146+
<div className="mb-6">
147+
<span className="text-charcoal-light text-base">Starting at</span>
148+
<div><span className="text-4xl font-bold text-charcoal">$300</span><span className="text-charcoal-light text-xl">/mo</span></div>
149+
</div>
150+
<p className="text-charcoal-light mb-6">Keep your tech running smoothly with regular help.</p>
151+
152+
<div className="space-y-3 mb-8">
153+
<p className="text-sm font-semibold text-charcoal mb-3">What&apos;s included:</p>
154+
<div className="flex gap-2 items-start">
155+
<span className="text-sage flex-shrink-0 mt-0.5">✓</span>
156+
<span className="text-sm text-charcoal-light">Email/Slack support</span>
157+
</div>
158+
<div className="flex gap-2 items-start">
159+
<span className="text-sage flex-shrink-0 mt-0.5">✓</span>
160+
<span className="text-sm text-charcoal-light">Monthly check-ins</span>
161+
</div>
162+
<div className="flex gap-2 items-start">
163+
<span className="text-sage flex-shrink-0 mt-0.5">✓</span>
164+
<span className="text-sm text-charcoal-light">Bug fixes and updates</span>
165+
</div>
166+
<div className="flex gap-2 items-start">
167+
<span className="text-sage flex-shrink-0 mt-0.5">✓</span>
168+
<span className="text-sm text-charcoal-light">Small improvements</span>
169+
</div>
170+
</div>
171+
172+
<p className="text-sm text-charcoal-light italic">Cancel anytime, no commitment</p>
173+
</div>
174+
175+
</div>
176+
</div>
177+
</section>
178+
179+
{/* Payment Terms */}
180+
<section className="py-16 bg-white">
181+
<div className="max-w-4xl mx-auto px-6">
182+
<h2 className="text-2xl font-semibold mb-8 text-center">How Payment Works</h2>
183+
184+
<div className="grid md:grid-cols-3 gap-6">
185+
<div className="text-center p-6 bg-cream rounded-2xl">
186+
<div className="text-3xl mb-3">💳</div>
187+
<h3 className="font-semibold mb-2">Simple Payment</h3>
188+
<p className="text-sm text-charcoal-light">50% to start, 50% on completion. For larger projects, we can split into milestones.</p>
189+
</div>
190+
<div className="text-center p-6 bg-cream rounded-2xl">
191+
<div className="text-3xl mb-3">⏱️</div>
192+
<h3 className="font-semibold mb-2">No Hourly Rates</h3>
193+
<p className="text-sm text-charcoal-light">Fixed prices mean no surprise invoices. You know exactly what you&apos;re paying upfront.</p>
194+
</div>
195+
<div className="text-center p-6 bg-cream rounded-2xl">
196+
<div className="text-3xl mb-3">✅</div>
197+
<h3 className="font-semibold mb-2">Revisions Included</h3>
198+
<p className="text-sm text-charcoal-light">Two rounds of revisions are included in every project. You&apos;ll get it right.</p>
199+
</div>
200+
</div>
201+
</div>
202+
</section>
203+
204+
{/* Pricing FAQ */}
205+
<section className="py-20 bg-cream">
206+
<div className="max-w-3xl mx-auto px-6">
207+
<h2 className="text-3xl font-semibold mb-12 text-center">Common Questions</h2>
208+
209+
<div className="space-y-6">
210+
<div className="bg-white rounded-2xl p-6 shadow-sm">
211+
<h3 className="font-semibold text-lg mb-3">What if my project doesn&apos;t fit these tiers?</h3>
212+
<p className="text-charcoal-light">No problem. These are just guidelines. Book a free call and tell me what you need—I&apos;ll give you a custom quote that makes sense.</p>
213+
</div>
214+
215+
<div className="bg-white rounded-2xl p-6 shadow-sm">
216+
<h3 className="font-semibold text-lg mb-3">What&apos;s NOT included in these prices?</h3>
217+
<p className="text-charcoal-light">Third-party costs like domain names, hosting, or software subscriptions. I&apos;ll always flag these upfront. Most clients spend $10-50/month on these basics.</p>
218+
</div>
219+
220+
<div className="bg-white rounded-2xl p-6 shadow-sm">
221+
<h3 className="font-semibold text-lg mb-3">Can I see examples of your work?</h3>
222+
<p className="text-charcoal-light">Absolutely. I&apos;ll show you my portfolio during our call. I&apos;m also happy to share references from past clients.</p>
223+
</div>
224+
225+
<div className="bg-white rounded-2xl p-6 shadow-sm">
226+
<h3 className="font-semibold text-lg mb-3">What if I just need advice?</h3>
227+
<p className="text-charcoal-light">The first call is free. If you just need 20 minutes of guidance, that&apos;s totally fine. If you need more, we can do a paid consultation or ongoing support.</p>
228+
</div>
229+
230+
<div className="bg-white rounded-2xl p-6 shadow-sm">
231+
<h3 className="font-semibold text-lg mb-3">What happens if something goes wrong?</h3>
232+
<p className="text-charcoal-light">I stand behind my work. If there&apos;s a bug or something breaks within 30 days of delivery, I&apos;ll fix it for free. No questions asked.</p>
233+
</div>
234+
</div>
235+
</div>
236+
</section>
237+
238+
{/* CTA */}
239+
<CTA
240+
headline="Ready to get a specific quote for your project?"
241+
subheadline="Book a free 20-minute call and I'll give you an honest assessment of what your project would cost and how long it would take."
242+
/>
243+
</>
244+
)
245+
}

‎components/Footer.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ export default function Footer() {
1919
<h4 className="text-sm uppercase tracking-wider text-white/50 font-semibold mb-3.5">Navigation</h4>
2020
<Link href="/#how-it-works" className="block text-white/80 hover:text-coral py-1 text-[15px]">How It Works</Link>
2121
<Link href="/#services" className="block text-white/80 hover:text-coral py-1 text-[15px]">Services</Link>
22+
<Link href="/pricing" className="block text-white/80 hover:text-coral py-1 text-[15px]">Pricing</Link>
2223
<Link href="/ai-for-business" className="block text-white/80 hover:text-coral py-1 text-[15px]">AI for Your Business</Link>
2324
<Link href="/blog" className="block text-white/80 hover:text-coral py-1 text-[15px]">Blog</Link>
2425
<Link href="/#contact" className="block text-white/80 hover:text-coral py-1 text-[15px]">Contact</Link>

‎components/Nav.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ export default function Nav() {
2828
const navLinks = [
2929
{ href: '/#how-it-works', label: 'How It Works' },
3030
{ href: '/#services', label: 'Services' },
31+
{ href: '/pricing', label: 'Pricing' },
3132
{ href: '/ai-for-business', label: 'AI for Your Business' },
3233
{ href: '/blog', label: 'Blog' },
3334
]

‎tests/config.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ module.exports = {
44
routes: [
55
'/',
66
'/ai-for-business',
7-
'/blog'
7+
'/blog',
8+
'/pricing'
89
]
910
}

0 commit comments

Comments
 (0)