AAWEA.ORG
AAWEA.ORG
AAWEA.ORG

Dark News Article UI Redesign

Dark News Article UI Redesign
๐Ÿ“ Prompt Template
Using REFERENCE_1 as the source article page and REFERENCE_0 as the site branding/navigation reference, redesign the article page into a polished modern dark-mode news UI while preserving the Japanese article topic and overall site identity. Keep the header with logo and nav links, but make the article layout wider and more editorial: add a back-to-archive link, a category pill, date, large bold headline, short intro paragraph, and a wide cinematic hero image with a dark space/planet glow motif. Reformat the article body into clear sections with exactly 5 visible section headings: ใ€ŒClaude Codeใฎ็™บ่กจใ€, ใ€Œ่จˆ็ฎ—่ณ‡ๆบใฎๅผทๅŒ–ใจใƒ‘ใƒผใƒˆใƒŠใƒผใ‚ทใƒƒใƒ—ใ€, ใ€Œๅˆฉ็”จ่ฆ็ด„ใฎๆ›ดๆ–ฐใจ่ฌ็ฝชใ€, ใ€ŒๆฉŸ่ƒฝใƒปใƒ—ใƒญใƒ€ใ‚ฏใƒˆใฎใ‚ขใƒƒใƒ—ใƒ‡ใƒผใƒˆใ€, and ใ€ŒไปŠๅพŒใฎๅฑ•ๆœ›ใ€. Add inline UI enhancements including one highlighted note/callout box, one quote box, bullet lists, and a bottom source-link card. Add a right sidebar containing exactly 4 stacked cards: 1) ใ€Œใ“ใฎ่จ˜ไบ‹ใฎ่ฆ็‚นใ€ with 5 numbered summary points, 2) ใ€Œใ‚ฟใ‚ฐใ€ with 6 tag chips labeled Anthropic, Claude, Claude Code, ใ‚จใƒผใ‚ธใ‚งใƒณใƒˆ, ่จˆ็ฎ—่ณ‡ๆบ, ใƒ‘ใƒผใƒˆใƒŠใƒผใ‚ทใƒƒใƒ—, 3) ใ€Œใ‚ทใ‚งใ‚ขใ€ with 4 share buttons/icons for link, Twitter/X, Facebook, and Hatena Bookmark, and 4) ใ€Œ้–ข้€ฃ่จ˜ไบ‹ใ€ with 4 related article links and dates. Use subtle borders, rounded cards, muted gray text, amber accent lines, and generous spacing; keep the footer links GitHub and news.smol.ai.
๐Ÿ’ก About This Prompt

Transforms a simple Japanese AI news article page into a modern dark editorial layout with sidebar summaries, tags, sharing, and related articles.

๏ฟฝ
ๅƒ่‘‰ๆ‘๏ผˆไบฌ้ƒฝ๏ผ‰
@ๅƒ่‘‰ๆ‘๏ผˆไบฌ้ƒฝ๏ผ‰
Metadata
Published Jun 12, 2026
Model
GPT Image 2 10 cr/run
Category
Typography
0
Likes
3
Views
0
Shares
0
Comments
0
Bookmarks
0
Uses
โšก TRY IT NOW
Share Now

0 Comments

Sign in to join the discussion
๐Ÿ’ฌ
No comments yet. Be the first!

๐Ÿ‘ฅ Co-learning Circle 0

Observe other members' variables & configurations, and click "Study & Retry" to instantly import settings and practice!

๐Ÿ‘ฅ
No users have run this prompt yet.
Preview