極簡開發者作品集

Generates a clean grid-based personal website homepage mockup for a software engineer portfolio design system.

{"type":"桌面瀏覽器截圖的簡約個人作品集網站首頁設計草稿","style":"瑞士網格系統、野獸派極簡主義、黑白配色方案、 faint 技術藍圖指南、細灰色邊框、大量空白、等寬微標籤混合粗體幾何無襯線顯示字體","canvas":{"aspect_ratio":"寬16:9","environment":"在類似Chrome的瀏覽器窗口中顯示，位址列為localhost:5173，可見標籤頁、書籤列和網址列","background":"white"},"brand":{"logo":"小方形輪廓標誌，帶有縮寫NRS","name":"{argument name=\"character name\" default=\"Naufaldi Rafif S.\"}"},"header":{"position":"頂部固定網站導航列，在瀏覽器介面下方","height":"約64px","left_brand":"NRS標誌後跟Naufaldi Rafif S.","navigation":{"count":6,"items":["HOME","BLOG","PROJECTS","ABOUT","SPEAKER","OTHER with down chevron"],"active_item":"HOME在細輪廓矩形標籤中"},"actions":{"count":3,"items":["Contact白色輪廓按鈕","Download CV黑色填充按鈕帶箭頭","小方形太陽/主題圖標按鈕"]}},"layout":{"main_container":"大居中矩形網格區域，帶有 faint 垂直和水平指南線、座標標籤和細邊框","technical_annotations":{"count":7,"labels":["X-1440","X-768","X-0","X-1024","X-768","X-480","Y-0 / Y-360 / Y-720 指南標記"]},"sections":[{"title":"01 // INTRO","position":"左側大內容欄","count":1,"content":"巨型框住標題讀作 {argument name=\"headline text\" default=\"NAUFALDI RAFIF S.\"} 分成兩行，黑色全大寫extra-bold字體"},{"title":"professional summary","position":"標題下方在左欄","count":3,"items":["副標題：{argument name=\"role title\" default=\"Software Engineer & Mentor\"}","專業標籤：PRODUCT SYSTEMS | BACKEND FOUNDATIONS | ENGINEERING MENTORSHIP","段落：{argument name=\"bio paragraph\" default=\"My foundation is frontend, but the direction is broader: backend ownership, product architecture, and end-to-end software delivery.\"}"]},{"title":"02 // ROUTES","position":"右側邊欄，由垂直分隔線分隔","count":3,"items":["01 View projects，黑色活動卡片帶代碼圖標和右箭頭","02 Get in touch，白色行帶右箭頭","03 Download CV，白色行帶右箭頭"]},{"title":"bottom status strip","position":"邊框容器底部","count":4,"items":["OPEN TO WORK","7 YRS EXPERIENCE","1000+ MENTEES","BEKASI, INDONESIA"]}],"footer_meta":"底部條右側顯示BUILD:2026和PRD:01"},"typography":{"headline":"巨大大寫粗體無襯線，緊湊間距","body":"乾淨可讀無襯線","microcopy":"小全大寫等寬，寬字距"},"color_palette":{"primary":"#0b0d0e 近黑色","background":"#ffffff","border":"#e8e8e8 淺灰色","guides":"#edf2ef 非常 faint 綠灰色","accent":"活動路由卡片和頂部網格指南上的細綠線"},"composition_notes":"讓它看起來像為實現而生成的精緻網頁設計系統模型，而不是營銷登陸頁面；強調精確對齊、網格覆蓋、座標標籤和現代開發者作品集美學。"}

機器翻譯 — 實際產出作品的是原文 prompt。

✨ 生成 收藏 複製 Prompt 分享 原始貼文 在 Hitboard 開啟