61 lines
1.4 KiB
Plaintext
61 lines
1.4 KiB
Plaintext
@startuml
|
|
!theme plain
|
|
skinparam defaultFontName Inter
|
|
skinparam backgroundColor #f8f9fa
|
|
|
|
package "Landing Page Layout" {
|
|
component "Hero Section" as hero {
|
|
[Value Prop: AI CLI tools for everyone] as value
|
|
[Install Snippet (copy button)] as snippet
|
|
[Primary CTA: Browse Tools] as primary
|
|
[Secondary CTA: View Docs] as secondary
|
|
}
|
|
|
|
component "Value Proposition Grid" as grid {
|
|
[Easy to Use\nBeginner-friendly] as easy
|
|
[Powerful\nAdvanced features] as powerful
|
|
[Community\nCollaboration] as community
|
|
}
|
|
|
|
component "Featured Tools" as tools {
|
|
[Tool Card 1] as tool1
|
|
[Tool Card 2] as tool2
|
|
[Tool Card 3] as tool3
|
|
}
|
|
note right of tools: 6-8 tools grid
|
|
|
|
component "Project Showcase" as projects {
|
|
[Project Card 1] as proj1
|
|
[Project Card 2] as proj2
|
|
[Project Card 3] as proj3
|
|
}
|
|
note right of projects: Real usage examples
|
|
|
|
component "Getting Started Preview" as getting {
|
|
[Tutorial Links] as tutorials
|
|
[Quick Start Guide] as guide
|
|
}
|
|
|
|
component "Footer" as footer {
|
|
[Newsletter Signup] as newsletter
|
|
[Navigation Links] as nav
|
|
[Social Links] as social
|
|
}
|
|
}
|
|
|
|
hero --> grid
|
|
grid --> tools
|
|
tools --> projects
|
|
projects --> getting
|
|
getting --> footer
|
|
|
|
note bottom of hero
|
|
Mobile: Single column
|
|
Desktop: Full width hero
|
|
end note
|
|
|
|
note bottom of footer
|
|
Optional AdSense banner
|
|
Newsletter: Minimal friction
|
|
end note
|
|
@enduml |