Skip to content

Redesign Dev Partner partnership narrative and improve mobile content density across service pages #52

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
iaretechnician merged 1 commit into from
May 30, 2026
Merged

Redesign Dev Partner partnership narrative and improve mobile content density across service pages #52

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
120 changes: 114 additions & 6 deletions assets/css/coreloop.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -579,7 +579,7 @@ body *[style*="color:#4cc9ff"] {
}

.service-section {
padding: 2.35rem 0;
padding: 1.95rem 0;
}

.service-section.alt {
Expand All @@ -595,7 +595,7 @@ body *[style*="color:#4cc9ff"] {
.section-intro {
max-width: 900px;
color: #bfd4ec;
margin-bottom: 0.75rem;
margin-bottom: 0.6rem;
}

.service-actions {
Expand Down Expand Up @@ -671,7 +671,7 @@ body *[style*="color:#4cc9ff"] {
background: linear-gradient(180deg, #0c1729, #0a1423);
border: 1px solid rgba(54, 243, 255, 0.2);
border-radius: 12px;
padding: 0.82rem;
padding: 0.72rem;
box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24);
}

Expand Down Expand Up @@ -725,7 +725,7 @@ body *[style*="color:#4cc9ff"] {
background: linear-gradient(125deg, #08111f, #0a84ff);
border-radius: 16px;
border: 1px solid rgba(255, 255, 255, 0.18);
padding: 1.55rem;
padding: 1.35rem;
}

.cta-block p {
Expand Down Expand Up @@ -894,6 +894,105 @@ body *[style*="color:#4cc9ff"] {
margin-bottom: 0.55rem;
}

.partnership-card {
background: linear-gradient(165deg, rgba(10, 20, 38, 0.95), rgba(9, 24, 46, 0.92));
border: 1px solid rgba(54, 243, 255, 0.24);
border-radius: 14px;
padding: 0.9rem;
}

.partnership-row {
display: grid;
grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
align-items: stretch;
gap: 0.45rem;
}

.partnership-block {
background: rgba(8, 17, 31, 0.82);
border: 1px solid rgba(54, 243, 255, 0.22);
border-radius: 10px;
padding: 0.75rem;
}

.partnership-block h3 {
margin: 0 0 0.45rem;
color: #f3fbff;
font-size: 1.03rem;
}

.partnership-icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
border-radius: 10px;
background: rgba(10, 132, 255, 0.25);
margin-bottom: 0.5rem;
font-size: 1.2rem;
}

.partnership-operator {
color: var(--core-gold);
font-weight: 700;
font-size: 1.45rem;
align-self: center;
}

.partnership-text {
color: #d3e6f9;
margin: 0.55rem 0 0;
}

.tools-flagship {
background: linear-gradient(180deg, rgba(8, 18, 33, 0.95), rgba(8, 26, 52, 0.86));
border-top: 1px solid rgba(255, 198, 0, 0.2);
border-bottom: 1px solid rgba(255, 198, 0, 0.2);
}

.workflow-diagram {
display: grid;
gap: 0.5rem;
margin-top: 0.9rem;
max-width: 620px;
}

.workflow-step {
display: flex;
align-items: center;
gap: 0.55rem;
border: 1px solid rgba(54, 243, 255, 0.24);
background: rgba(10, 20, 38, 0.82);
border-radius: 10px;
padding: 0.55rem 0.7rem;
}

.workflow-step span {
width: 28px;
height: 28px;
border-radius: 50%;
background: rgba(255, 198, 0, 0.2);
color: var(--core-gold);
display: inline-flex;
align-items: center;
justify-content: center;
font-weight: 700;
flex: 0 0 auto;
}

.workflow-step p {
margin: 0;
color: #e8f5ff;
}

.workflow-arrow {
color: var(--core-gold);
text-align: center;
font-size: 1.2rem;
line-height: 1;
}

.portfolio-category {
margin-top: 2rem;
}
Expand Down Expand Up @@ -1013,7 +1112,7 @@ body *[style*="color:#4cc9ff"] {
@media (max-width: 768px) {
.service-hero,
.service-section {
padding: 2.05rem 0;
padding: 1.72rem 0;
}

.service-actions {
Expand All @@ -1029,7 +1128,16 @@ body *[style*="color:#4cc9ff"] {
grid-template-columns: 1fr;
}

.partnership-row {
grid-template-columns: 1fr;
}

.partnership-operator {
justify-self: center;
line-height: 1;
}

.cta-block {
padding: 1.2rem;
padding: 1.05rem;
}
}
153 changes: 91 additions & 62 deletions design-debug-deploy.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,89 +31,118 @@

<section class="service-section">
<div class="container">
<h2>Your Team 🤝 Runlevel Systems</h2>
<div class="ddd-partnership-grid">
<article class="ddd-team-visual">
<div class="team-link">
<div class="team-block">
<p>Your Team</p>
</div>
<div class="team-connector" aria-hidden="true">🤝</div>
<div class="team-block">
<p>Runlevel Systems</p>
</div>
<h2>Your Team + Runlevel Systems</h2>
<p class="ddd-subtitle">A Development Partnership When You Need Extra Help</p>
<article class="partnership-card">
<div class="partnership-row">
<div class="partnership-block">
<span class="partnership-icon" aria-hidden="true">👥</span>
<h3>Your Team</h3>
<ul class="service-icon-list single-column">
<li>Vision</li>
<li>Goals</li>
<li>Industry knowledge</li>
</ul>
</div>
</article>
<article class="service-detail-card">
<ul class="service-icon-list single-column">
<li>You bring the vision, goals, project knowledge, and business requirements.</li>
<li>We bring technical expertise, development experience, deployment knowledge, troubleshooting skills, and infrastructure support.</li>
<li><strong>Together we move the project forward.</strong></li>
</ul>
</article>
</div>
<div class="partnership-operator" aria-hidden="true">+</div>
<div class="partnership-block">
<span class="partnership-icon" aria-hidden="true">🤝</span>
<h3>Runlevel Systems</h3>
<ul class="service-icon-list single-column">
<li>Technical expertise</li>
<li>Infrastructure</li>
<li>Deployment experience</li>
</ul>
</div>
<div class="partnership-operator" aria-hidden="true">=</div>
<div class="partnership-block">
<span class="partnership-icon" aria-hidden="true">🚀</span>
<h3>Project Success</h3>
<ul class="service-icon-list single-column">
<li>Working product</li>
<li>Launch</li>
<li>Growth</li>
</ul>
</div>
</div>
<p class="partnership-text">You bring the vision, project goals, customer knowledge, and business requirements.</p>
<p class="partnership-text">Runlevel Systems brings technical expertise, development experience, infrastructure knowledge, deployment support, and troubleshooting assistance.</p>
<p class="partnership-text"><strong>Together, we help move projects from idea to reality.</strong></p>
</article>
</div>
</section>

<section class="service-section alt">
<div class="container">
<h2>Runlevel Tools</h2>
<p class="ddd-subtitle">Your Development Hub</p>
<div class="compact-copy">
<p>Runlevel Tools is a shared development workspace designed to keep projects organized and moving forward.</p>
<p>Instead of managing tasks, notes, bugs, documentation, and technical requests across multiple disconnected platforms, Runlevel Tools provides a central hub for your project.</p>
<p>It combines planning, tracking, documentation, collaboration, and direct access to Runlevel Systems support.</p>
</div>
<h2>Why People Hire A Dev Partner</h2>
<p class="section-intro">Projects often stall because teams need practical technical help at the right moment.</p>
<div class="service-card-grid">
<article class="service-card-item"><h3>Project Planning</h3><p>Track goals, milestones, features, and project requirements.</p></article>
<article class="service-card-item"><h3>Kanban Boards</h3><p>Organize development work using visual workflows.</p></article>
<article class="service-card-item"><h3>Issue Tracking</h3><p>Report bugs, request features, and track technical problems.</p></article>
<article class="service-card-item"><h3>Documentation</h3><p>Store notes, specifications, onboarding information, and project knowledge.</p></article>
<article class="service-card-item"><h3>Development Requests</h3><p>Need help? Create an issue directly from the workspace and send it to Runlevel Systems.</p></article>
<article class="service-card-item"><h3>Progress Tracking</h3><p>Monitor project status and development progress.</p></article>
<article class="service-card-item"><h3>Source Control Integration</h3><p>Connect project repositories and development workflows.</p></article>
<article class="service-card-item"><h3>Team Collaboration</h3><p>Keep your team working from a shared source of truth.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">⏸️</span><h3>Project Stalled</h3><p>We diagnose blockers, rebuild momentum, and get delivery moving again.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">👋</span><h3>Developer Left</h3><p>We step in quickly, document the current state, and stabilize the roadmap.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">📦</span><h3>Won&rsquo;t Publish</h3><p>We resolve release blockers, fix build issues, and prepare your launch pipeline.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">📱</span><h3>Need An iOS Version</h3><p>We plan cross-platform delivery and help expand your product to iOS.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">🎮</span><h3>Need Multiplayer</h3><p>We design backend workflows and implementation paths for multiplayer features.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">🌐</span><h3>Need A Website</h3><p>We deliver connected web experiences that support your product and growth.</p></article>
</div>
</div>
</section>

<section class="service-section">
<div class="container">
<h2>Get Help When You Need It</h2>
<h2>How We Help</h2>
<div class="service-card-grid two-columns">
<article class="service-detail-card">
<p>One of the biggest challenges for small teams is getting technical help when a problem appears.</p>
<p>With Runlevel Tools, support requests become part of the project workflow.</p>
<ul class="service-quote-list">
<li>&ldquo;My build no longer works.&rdquo;</li>
<li>&ldquo;We need help publishing.&rdquo;</li>
<li>&ldquo;We need an iOS version.&rdquo;</li>
<li>&ldquo;Our website integration is broken.&rdquo;</li>
<li>&ldquo;We need a multiplayer backend.&rdquo;</li>
<li>&ldquo;We need a feature implemented.&rdquo;</li>
</ul>
</article>
<article class="service-card-item">
<h3>Request Help Directly In Workspace</h3>
<ul class="service-icon-list single-column">
<li>Create a request.</li>
<li>Attach screenshots, notes, and details.</li>
<li>Keep support tied to project context.</li>
<li>Get Runlevel Systems help to move the project forward.</li>
</ul>
</article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">🧭</span><h3>Technical Direction</h3><p>Get clear next steps, realistic scope, and decision support for your roadmap.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">🧰</span><h3>Delivery Support</h3><p>We handle implementation work, unblock engineering tasks, and protect momentum.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">⚙️</span><h3>Infrastructure Guidance</h3><p>Set up environments, deployment workflows, and operational practices that scale.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">🛠️</span><h3>Troubleshooting</h3><p>Fix urgent technical issues before they become expensive schedule delays.</p></article>
</div>
</div>
</section>

<section class="service-section alt">
<div class="container">
<h2>More Than Project Management</h2>
<p class="section-intro">Runlevel Tools is not just another Kanban board.</p>
<p class="section-intro">It is a collaboration hub that connects your team with planning tools, project tracking, documentation, deployment assistance, and direct access to Runlevel Systems when technical help is needed.</p>
<h2>What We Can Build</h2>
<div class="service-card-grid two-columns">
<article class="service-card-item"><h3>Dev Partner Services</h3><ul class="service-icon-list"><li>Project rescue</li><li>Website development</li><li>Mobile app support</li><li>Publishing assistance</li></ul></article>
<article class="service-card-item"><h3>Technical Delivery Support</h3><ul class="service-icon-list"><li>Custom features</li><li>Infrastructure guidance</li><li>Troubleshooting and unblock support</li><li>Deployment and release help</li></ul></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">🕸️</span><h3>Web Platforms</h3><p>Customer portals, dashboards, and websites connected to your core product.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">📲</span><h3>Mobile Features</h3><p>iOS and Android capabilities that extend your product experience.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">☁️</span><h3>Backend Systems</h3><p>APIs, automation, integrations, and cloud services that support real users.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">🧩</span><h3>Custom Components</h3><p>Targeted systems for gameplay, operations, workflow tooling, and growth needs.</p></article>
</div>
</div>
</section>

<section class="service-section tools-flagship">
<div class="container">
<h2>Runlevel Tools</h2>
<p class="ddd-subtitle">Your Development Hub</p>
<p class="section-intro">Runlevel Tools is a shared development workspace designed to help teams plan, build, track, and launch projects while providing direct access to Runlevel Systems when help is needed.</p>
<div class="service-card-grid">
<article class="service-card-item"><span class="service-icon" aria-hidden="true">📋</span><h3>Kanban Boards</h3><p>Organize development work with clear visual workflow stages.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">🐞</span><h3>Issue Tracking</h3><p>Capture blockers, bugs, and feature requests in one place.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">📚</span><h3>Documentation</h3><p>Keep requirements, notes, and technical references accessible to everyone.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">🔗</span><h3>Source Control Integration</h3><p>Connect repos and development workflows to project planning.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">🗺️</span><h3>Project Planning</h3><p>Track milestones, delivery targets, and execution priorities.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">👥</span><h3>Team Collaboration</h3><p>Share context and decisions without tool sprawl.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">📨</span><h3>Development Requests</h3><p>Submit technical requests directly to Runlevel Systems support.</p></article>
<article class="service-card-item"><span class="service-icon" aria-hidden="true">📈</span><h3>Progress Tracking</h3><p>See status changes and delivery progress at a glance.</p></article>
</div>
</div>
</section>

<section class="service-section alt">
<div class="container">
<h2>Help Request Workflow</h2>
<p class="section-intro">Support requests stay connected to project context from first report to final delivery.</p>
<div class="workflow-diagram" role="img" aria-label="Create issue, describe problem, review by Runlevel Systems, solution implemented, project moves forward">
<div class="workflow-step"><span aria-hidden="true">1</span><p>Create Issue</p></div>
<div class="workflow-arrow" aria-hidden="true">↓</div>
<div class="workflow-step"><span aria-hidden="true">2</span><p>Describe Problem</p></div>
<div class="workflow-arrow" aria-hidden="true">↓</div>
<div class="workflow-step"><span aria-hidden="true">3</span><p>Runlevel Systems Reviews</p></div>
<div class="workflow-arrow" aria-hidden="true">↓</div>
<div class="workflow-step"><span aria-hidden="true">4</span><p>Solution Implemented</p></div>
<div class="workflow-arrow" aria-hidden="true">↓</div>
<div class="workflow-step"><span aria-hidden="true">5</span><p>Project Moves Forward</p></div>
</div>
</div>
</section>
Expand Down
Loading
Loading