📦
seo-copywriter-pro
38大規模建立 SEO 內容
在地 SEO 團隊需要大量最佳化頁面，同時不失去結構或一致性。此技能提供關鍵字地圖、範本、schema 範例與驗證工作流程，用於可重複的內容製作。
寫作與內容 查看
技能 frontend-design
📦
frontend-design
內容修訂 r1 安全
設計具辨識度的前端介面
泛用介面會降低信任感，並讓產品顯得尚未完成。此技能可協助 Claude、Codex 和 Claude Code 建立具有明確視覺方向、精緻完善的前端設計。
支援: Claude Codex Code(CC)
使用我的智慧代理安裝
將此請求複製給你的智慧代理，其中包含權威 Skill 頁面和清單。
智能體請求
Review the Skillstore skill "frontend-design" from https://skillstore.io/skills/1bertogit-frontend-design.md and its manifest at https://skillstore.io/api/skills/1bertogit-frontend-design/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.你的智慧代理仍應顯示其計畫，並依安全政策請求必要確認。
Agent 可讀資源
當 AI Agent、爬蟲或腳本需要乾淨脈絡、而不是讀取完整頁面時，請使用這些連結。
測試它
正在使用「frontend-design」。 Create a dashboard for a music streaming app.
預期結果:
具有清晰視覺概念、精緻字體排印、動畫狀態變化與生產可用元件結構的響應式儀表板。
正在使用「frontend-design」。 Build a landing page for an AI security startup.
預期結果:
具備強烈品牌語氣、鮮明色彩系統、精緻版面配置，以及用於產品訊息傳達之響應式區塊的完整頁面。
正在使用「frontend-design」。 Design a settings panel with dark mode.
預期結果:
具備細緻間距、符合無障礙對比目標、清楚控制項與一致深色主題的功能性設定介面。
安全審計
安全v6 • 2026/7/6 開啟版本化報告
The static findings are false positives from design guidance that uses words like distinctive, generic, and backgrounds. No evidence of system reconnaissance, prompt injection, data exfiltration, or hidden execution was found in the reviewed files.
4
已掃描檔案
105
分析行數
0
複核項目
0
已忽略的誤報
最近一次完成的靜態與語意稽核未偵測到已確認的安全發現。這並不能證明該 Skill 沒有副作用。
審計單位: codex 檢視審計紀錄 →
分享與引用此報告
分享版本化評估報告、中性徽章、嵌入卡片與引用。Skillstore 只報告證據，不判斷該 Skill 是否安全。
複製報告連結
https://skillstore.io/skills/1bertogit-frontend-design/audits/6?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdown 徽章
[](https://skillstore.io/skills/1bertogit-frontend-design?utm_source=security_passport_badge)HTML 徽章
<a href="https://skillstore.io/skills/1bertogit-frontend-design?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/1bertogit-frontend-design/security.svg" alt="Skillstore security assessment" loading="lazy"></a>嵌入卡片
<iframe src="https://skillstore.io/embed/skills/1bertogit-frontend-design.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>學術引用 (APA · BibTeX · CFF)
APA 引用
1bertogit. (2026). frontend-design security audit report (audit version 6) [Author version unspecified]. Skillstore. https://skillstore.io/skills/1bertogit-frontend-design/audits/6BibTeX 引用
@techreport{1bertogit-1bertogit-frontend-design-2026,
author = {1bertogit},
title = {frontend-design security audit report (audit version 6)},
institution = {Skillstore},
year = {2026},
number = {6},
url = {https://skillstore.io/skills/1bertogit-frontend-design/audits/6},
note = {Author version unspecified}
}CITATION.cff
cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "frontend-design security audit report (audit version 6)"
version: "unspecified"
type: report
authors:
- name: "1bertogit"
date-released: "2026-07-06"
url: "https://skillstore.io/skills/1bertogit-frontend-design/audits/6"
identifiers:
- type: other
value: "skillstore:1bertogit-frontend-design:audit:6"
description: "Skillstore immutable audit report identifier"
比較變體
18 個可安裝變體每位作者的技能都保留為獨立的可安裝項目。推薦變體依 Skillstore 證據排序。
為何此變體排名第一
Skillstore 評分最高
作者 / 來源 Skillstore 評分 證據置信度 Skillstore 使用量 已更新
atman36-frontend-design
Skillstore 評分 81
證據置信度 高
Skillstore 使用量 49
已更新
2026-10-25
adamaugustinsky-frontend-design
Skillstore 評分 79
證據置信度 高
Skillstore 使用量 25
已更新
2026-10-21
cesaraugustusgrob-frontend-design
Skillstore 評分 79
證據置信度 高
Skillstore 使用量 20
已更新
2026-09-09
agentworkforce-frontend-design
Skillstore 評分 78
證據置信度 高
Skillstore 使用量 24
已更新
2026-10-22
Skillstore 評分
評分依據 證據置信度: 高 55
架構
85
可維護性
87
內容
76
社群
91
規範符合度
你可以打造什麼
建立產品儀表板
設計並建置具備鮮明視覺風格、清楚層級與實用互動狀態的精緻儀表板。
更新行銷頁面
透過更強的字體排印、動態效果與版面選擇，將普通的登陸頁轉變為更令人印象深刻的體驗。
製作應用程式介面原型
產生符合產品受眾、語氣與技術限制的可運作介面概念。
試試這些提示
建置簡單元件
Create a pricing card component for a small SaaS product. Use a distinctive visual style and production-ready CSS.
設計完整頁面
Build a landing page for an AI security startup. Choose a bold aesthetic direction and implement the full responsive page.
改善現有介面
Redesign this settings panel for a developer tool. Keep the same features, but improve hierarchy, spacing, motion, and visual polish.
建立多畫面原型
Create a three-screen prototype for a music collaboration app. Define a cohesive visual system and implement realistic interactive states.
最佳實務
- 在要求實作前，提供產品情境、目標使用者與期望語氣。
- 指定專案所需的框架、元件邊界與響應式目標。
- 在重要時，明確提出無障礙、效能與互動需求。
避免
- 不要在缺乏產品情境的情況下要求泛用的現代設計。
- 不要在省略必要內容、狀態或資料密度的同時要求視覺精緻度。
- 不要依賴此技能取代設計審查、可用性測試或無障礙驗證。
常見問題
此技能能協助建立什麼？
它有助於建立具有更強視覺方向與生產級實作指引的網頁元件、頁面與應用程式介面。
哪些工具可以使用它？
報告列出支援 Claude、Codex 和 Claude Code。
它會生成可運作的程式碼嗎？
可以。此技能會要求助理實作可運作的前端程式碼，而不只是描述設計想法。
它會自動選擇設計風格嗎？
它會鼓勵助理根據請求與產品情境選擇清晰的美學方向。
它可以改善現有介面嗎？
可以。提供目前介面、限制與目標，讓助理在保留功能的同時改善設計品質。
它是安全或部署工具嗎？
不是。它專注於前端設計指引與實作品質，而不是安全掃描或部署自動化。
開發者詳細資訊
作者
1bertogit授權
Complete terms in LICENSE.txt
Skillstore 修訂
r1
版本提示
作者未聲明版本。
引用
c1fdca50ff516318f65fed0d7f9e82797c5171dc
維護新鮮度
2026/7/18
使用量
175 次下載 · 275 次瀏覽
檔案結構
1bertogit 的更多技能
查看全部相關技能
查看全部📦
ui-design
80設計具辨識度的 UI 原型
由 tencentcloudbase
一般化的 AI 介面通常缺乏視覺方向與符合平台脈絡的細節。此技能會引導 Claude、Codex 和 Claude Code 在建置原型前先定義設計意圖。
設計與創意 查看
📦
uizze-ui
80Build and Refine Interfaces with Uizze
由 uizze
Interface changes can lose visual consistency or disrupt existing workflows. This skill guides implementation from visual targets and project conventions, with optional Uizze resources and explicit verification.
設計與創意 查看
📦
ui-styling
83Build Accessible Tailwind Interfaces
由 nextlevelbuilder
Building consistent, responsive interfaces requires many component, styling, and accessibility decisions. This skill provides shadcn/ui patterns, Tailwind guidance, and focused automation.
設計與創意 查看
📦
design-system
82Build Consistent Design Systems and Slides
由 nextlevelbuilder
Inconsistent tokens and components make design handoffs difficult. This skill structures tokens, validates usage, and generates brand-aligned presentation assets.
設計與創意 查看
📦
shape
81建置前先規劃 UX
由 pbakaus
團隊常在釐清使用者目標、狀態與限制之前就開始建置介面。此技能會引導探索流程，並產出可供實作使用的設計簡報。
設計與創意 查看
📦
ux-designer
80透過研究導向的設計指引改善 UX
由 shubhamsaboo
團隊常根據假設設計流程，並忽略無障礙問題。此技能運用 UX 最佳實務，指導研究、結構、互動設計與審查。
設計與創意 查看