15 skills (repositories by jakubkrehel) · sorted by popularity
Create static technical drawings from object descriptions, photographs, or CAD models. Produce consistent views that explain shape or assembly, plus a viewer with zoom, editable colors, and downloads in SVG, PNG, and PDF formats.
Review a branch, pull request, or uncommitted changes for interface problems involving accessibility, layout, text, typography, and color. The report distinguishes newly introduced issues, regressions, and existing problems, including effects on screens that use changed components.
Refine interface surfaces, icons, and motion with specific values for corners, shadows, alignment, and transitions. Preserve the project's existing design conventions while identifying visual inconsistencies, touch interaction problems, and missing alternatives for reduced motion.
Review an interface across accessibility, layout, writing, typography, color, and visual polish. It coordinates specialist skills, combines evidence from code and rendered screens, and produces one report with findings ranked by their impact on users.
Build and review interface color systems with palettes, format conversions, and semantic tokens that name colors by purpose. Measure foreground and background contrast, and identify inconsistent themes, misused color roles, and colors outside the supported range.
Stress test one interface component on a temporary page using scenarios that its inputs and states can actually produce. View the examples together, record visible failures, and keep the annotated page available as a visual report.
Set and review how interface text renders, including font loading, size hierarchy, line spacing, wrapping, truncation, and punctuation. Apply fixes within the existing styling system and check how realistic content behaves across different widths.
Review and improve interface grouping, alignment, spacing, and responsive structure. Check whether content and actions remain accessible when screens resize, text grows in translation, zoom increases, or the layout switches to right-to-left reading.
Write and review interface text, including button labels, errors, empty states, and confirmations. Match the product's established vocabulary and tone, explain actions clearly, and give people a useful next step when something goes wrong.
Explain how a website, visual effect, or animation works from a live URL or screenshot. Identify the layers and techniques behind the appearance, distinguish measurements from inferences, and describe the principles that can transfer to other interfaces.
Create three distinct versions of one interface component and compare them at full size on the actual page. Explore a chosen design dimension, review each option's tradeoffs, and integrate the selected version while removing the temporary comparison controls.
Review and fix interface accessibility against WCAG 2.2, a web accessibility standard. Check keyboard navigation, focus, screen reader labels, forms, motion, and zoom, then report failures with their criteria and implement fixes using the project's existing styling system.
Turn a Figma file or design image into a working interface using the project's existing components and design tokens, its shared visual settings. Compare the implementation with the design and report differences, missing states, and parts awaiting backend connections.
Create a temporary workbench for one existing component, using realistic mock data and a grouped state switcher. View loading, empty, error, access, and other implemented states individually, with a link to each state.
Design engineering principles for making interfaces feel polished. Use when building UI components, reviewing frontend code, implementing animations, hover states, shadows, borders, typography, icons, micro-interactions, enter/exit animations, or any visual detail work. Supports quick and full review modes. Triggers on UI polish, design details, "make it feel better", "feels off", stagger animations, border radius, optical alignment, font smoothing, tabular numbers, image outlines, box shadows, icons, icon stroke weight, icon states, motion restraint.
The English summary is being prepared. Showing the original description.