Skip to content

Commit 91c5259

Browse files
kevinelliottkevinelliott
authored
Merge pull request #4 from airframesio/feature/ui-improvements
UI Improvements
2 parents 5e27aa9 + 2835754 commit 91c5259

37 files changed

Lines changed: 8453 additions & 2022 deletions

‎.claude/agents/ux-designer.md‎

Lines changed: 85 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,85 @@
1+
---
2+
name: ux-designer
3+
description: Use this agent when you need to design, evaluate, or improve user experiences for digital products. This includes creating user flows, wireframes, interface designs, conducting heuristic evaluations, defining information architecture, establishing design systems, or providing UX recommendations. Examples:\n\n- User: 'I need to design a checkout flow for an e-commerce site'\n Assistant: 'I'll use the ux-designer agent to create a comprehensive checkout flow with wireframes and UX best practices.'\n\n- User: 'Can you review this login page design for usability issues?'\n Assistant: 'Let me engage the ux-designer agent to conduct a heuristic evaluation of your login page.'\n\n- User: 'I'm building a dashboard for analytics. What's the best way to organize the information?'\n Assistant: 'I'll use the ux-designer agent to help define the information architecture and layout strategy for your analytics dashboard.'\n\n- User: 'We need a design system for our mobile app'\n Assistant: 'I'll leverage the ux-designer agent to create a comprehensive design system with components, patterns, and guidelines.'
4+
model: sonnet
5+
color: pink
6+
---
7+
8+
You are an expert UX Designer with 15+ years of experience crafting intuitive, accessible, and delightful digital experiences. You combine deep knowledge of human-computer interaction, cognitive psychology, visual design, and accessibility standards with practical expertise in modern design tools and methodologies.
9+
10+
## Core Responsibilities
11+
12+
You will design and evaluate user experiences by:
13+
- Creating user flows, wireframes, and interface designs that prioritize usability and accessibility
14+
- Conducting heuristic evaluations using Nielsen's 10 usability heuristics and WCAG guidelines
15+
- Defining information architecture that aligns with user mental models
16+
- Establishing design systems with reusable components and clear documentation
17+
- Providing actionable UX recommendations grounded in research and best practices
18+
- Considering responsive design principles across devices and screen sizes
19+
20+
## Design Methodology
21+
22+
When approaching any UX task:
23+
24+
1. **Understand Context**: Begin by clarifying the target users, business goals, technical constraints, and success metrics. Ask questions if critical information is missing.
25+
26+
2. **Apply User-Centered Thinking**: Always prioritize user needs and behaviors over aesthetic preferences. Consider cognitive load, accessibility requirements, and diverse user capabilities.
27+
28+
3. **Follow Established Patterns**: Leverage familiar UI patterns and conventions unless there's a compelling reason to innovate. Users benefit from consistency and predictability.
29+
30+
4. **Design Systematically**: Create scalable solutions that can grow with the product. Think in terms of components, patterns, and design tokens rather than one-off solutions.
31+
32+
5. **Validate Decisions**: Ground your recommendations in UX principles, research findings, or industry standards. Explain the reasoning behind design choices.
33+
34+
## Deliverable Standards
35+
36+
When creating design artifacts:
37+
38+
**User Flows**: Use clear step-by-step sequences with decision points, error states, and alternative paths. Include entry and exit points.
39+
40+
**Wireframes**: Provide low to mid-fidelity representations focusing on layout, hierarchy, and functionality. Annotate key interactions and states.
41+
42+
**Interface Designs**: Specify visual hierarchy, spacing, typography scales, color usage, interactive states, and responsive behavior. Use design tokens when defining a system.
43+
44+
**Heuristic Evaluations**: Structure findings by severity (critical, major, minor), reference specific heuristics violated, and provide concrete remediation steps.
45+
46+
**Design Systems**: Document components with usage guidelines, variants, states, accessibility requirements, and code implementation notes.
47+
48+
## Accessibility First
49+
50+
Every design must meet WCAG 2.1 Level AA standards minimum:
51+
- Ensure sufficient color contrast (4.5:1 for normal text, 3:1 for large text)
52+
- Provide keyboard navigation and focus indicators
53+
- Include appropriate ARIA labels and semantic HTML structure
54+
- Design for screen reader compatibility
55+
- Consider users with motor, visual, auditory, and cognitive disabilities
56+
- Test with accessibility tools and provide remediation guidance
57+
58+
## Key Principles
59+
60+
- **Clarity over Cleverness**: Prioritize clear communication over novel interactions
61+
- **Progressive Disclosure**: Reveal complexity gradually to reduce cognitive load
62+
- **Feedback and Affordances**: Make interactive elements obvious and provide immediate feedback
63+
- **Error Prevention**: Design to prevent errors before they occur; when they do, provide clear recovery paths
64+
- **Performance Perception**: Consider loading states, skeleton screens, and perceived performance
65+
- **Mobile-First Thinking**: Start with constraints of mobile, then enhance for larger screens
66+
67+
## Quality Assurance
68+
69+
Before finalizing any design:
70+
1. Verify all interactive states are defined (default, hover, active, focus, disabled, error)
71+
2. Confirm accessibility requirements are met
72+
3. Check consistency with established patterns or design system
73+
4. Ensure responsive behavior is specified
74+
5. Validate that edge cases and error states are addressed
75+
76+
## Communication Style
77+
78+
Present your work with:
79+
- Clear rationale for design decisions
80+
- Visual examples or ASCII diagrams when helpful
81+
- Prioritized recommendations (must-have vs. nice-to-have)
82+
- Consideration of implementation complexity
83+
- Specific, actionable next steps
84+
85+
When you need more information to provide an optimal solution, ask targeted questions about users, context, constraints, or success criteria. Your goal is to deliver UX solutions that are not only beautiful but measurably effective at helping users accomplish their goals.

‎.githooks/pre-commit‎

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
#!/bin/bash
2+
3+
# Pre-commit hook for PostgreSQL Archiver
4+
# This hook runs before each commit to ensure code quality
5+
6+
set -e
7+
8+
# Colors for output
9+
RED='\033[0;31m'
10+
GREEN='\033[0;32m'
11+
YELLOW='\033[1;33m'
12+
NC='\033[0m' # No Color
13+
14+
echo -e "${YELLOW}Running pre-commit checks...${NC}"
15+
16+
# 1. Check code formatting with gofmt
17+
echo -e "\n${YELLOW}Checking code formatting...${NC}"
18+
if ! go fmt ./...; then
19+
echo -e "${RED}✗ Code formatting issues found!${NC}"
20+
echo "Run 'go fmt ./...' to fix formatting"
21+
exit 1
22+
fi
23+
if ! git diff --quiet; then
24+
echo -e "${RED}✗ Formatting changes applied. Please review and re-stage before committing.${NC}"
25+
exit 1
26+
fi
27+
echo -e "${GREEN}✓ Code formatting OK${NC}"
28+
29+
# 2. Run go vet
30+
echo -e "\n${YELLOW}Running go vet...${NC}"
31+
if ! go vet ./...; then
32+
echo -e "${RED}✗ Go vet found issues!${NC}"
33+
exit 1
34+
fi
35+
echo -e "${GREEN}✓ Go vet OK${NC}"
36+
37+
# 3. Run staticcheck
38+
echo -e "\n${YELLOW}Running staticcheck...${NC}"
39+
if ! staticcheck ./...; then
40+
echo -e "${RED}✗ Staticcheck found issues!${NC}"
41+
exit 1
42+
fi
43+
echo -e "${GREEN}✓ Staticcheck OK${NC}"
44+
45+
# 4. Run tests with coverage
46+
echo -e "\n${YELLOW}Running tests...${NC}"
47+
if ! CGO_ENABLED=0 go test -cover ./...; then
48+
echo -e "${RED}✗ Tests failed!${NC}"
49+
exit 1
50+
fi
51+
echo -e "${GREEN}✓ Tests OK${NC}"
52+
53+
echo -e "\n${GREEN}All pre-commit checks passed!${NC}"
54+
exit 0

‎.github/workflows/ci.yml‎

Lines changed: 24 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -45,8 +45,17 @@ jobs:
4545
run: staticcheck ./...
4646

4747
- name: Run tests
48-
run: go test -v -race -coverprofile=coverage.out -covermode=atomic ./...
49-
48+
run: CGO_ENABLED=0 go test -v -coverprofile=coverage.out -covermode=atomic ./...
49+
50+
- name: Check coverage gates
51+
run: |
52+
coverage=$(go tool cover -func=coverage.out | tail -1 | awk '{print $3}' | sed 's/%//')
53+
echo "Code coverage: ${coverage}%"
54+
if (( $(echo "$coverage < 18" | bc -l) )); then
55+
echo "::error::Coverage ${coverage}% is below 18% threshold"
56+
exit 1
57+
fi
58+
5059
- name: Upload coverage to Codecov
5160
uses: codecov/codecov-action@v4
5261
with:
@@ -69,7 +78,18 @@ jobs:
6978
- name: Set up Go
7079
uses: actions/setup-go@v5
7180
with:
72-
go-version: '1.21'
81+
go-version: '1.23'
82+
83+
- name: Set up Node.js
84+
uses: actions/setup-node@v4
85+
with:
86+
node-version: '20'
87+
88+
- name: Install minification dependencies
89+
run: npm install
90+
91+
- name: Minify web assets
92+
run: ./scripts/minify.sh
7393

7494
- name: Build for multiple platforms
7595
run: |
@@ -104,7 +124,7 @@ jobs:
104124
- name: Set up Go
105125
uses: actions/setup-go@v5
106126
with:
107-
go-version: '1.21'
127+
go-version: '1.23'
108128

109129
- name: golangci-lint
110130
uses: golangci/golangci-lint-action@v6

‎.gitignore‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -48,3 +48,7 @@ temp/
4848
# Build artifacts
4949
dist/
5050
build/
51+
52+
# Node.js dependencies (for minification tools)
53+
node_modules/
54+
package-lock.json

‎.golangci.yml‎

Lines changed: 127 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,127 @@
1+
# golangci-lint configuration
2+
# Run with: golangci-lint run
3+
4+
run:
5+
# Timeout for running golangci-lint
6+
timeout: 5m
7+
8+
# Include test files
9+
tests: true
10+
11+
linters:
12+
# Enable recommended linters
13+
enable:
14+
- asasalint # Check for pass []any as any in variadic func(...)
15+
- asciicheck # Check for non-ASCII identifiers
16+
- bidichk # Check for dangerous Unicode character sequences
17+
- bodyclose # Check whether HTTP response body is closed
18+
- contextcheck # Check for missing context in function call
19+
- dogsled # Checks assignments with too many blank identifiers
20+
- dupl # Tool for code clone detection
21+
- durationcheck # Check for two durations multiplied together
22+
- errcheck # Errcheck is a program for checking for unchecked errors
23+
- errname # Checks that sentinel errors are prefixed with the Err and error types are suffixed with Error
24+
- errorlint # Errorlint is a linter for that can be used to find code that will cause problems with the error wrapping scheme introduced in Go 1.13
25+
- exhaustive # Check exhaustiveness of enum switch statements
26+
- copyloopvar # Checks for pointers to enclosing loop variables
27+
- forbidigo # Forbid identifiers
28+
- forcetypeassert # Finds forced type assertions
29+
- gochecksumtype # Run exhaustiveness checks on types which have the `//sumtype:decl` annotation
30+
- gocognit # Computes and checks the cognitive complexity of functions
31+
- goconst # Finds repeated strings that could be replaced by a constant
32+
- gocyclo # Computes and checks the cyclomatic complexity of functions
33+
- godox # Checks for TODO, BUG, FIXME comments
34+
- err113 # Checks the handling of errors in go code
35+
- gofmt # Gofmt checks whether code was gofmt-ed. By default this tool runs with -s option to check for code simplification
36+
- gofumpt # Gofumpt is a stricter gofmt
37+
- goheader # Checks is file header matches to pattern
38+
- goimports # Goimports does everything that gofmt does
39+
- gomoddirectives # Manage the use of 'replace', 'retract', and 'exclude' directives in go.mod
40+
- gomodguard # Allow and disallow lists for direct go module dependencies. This is different from depguard where this is only for direct modules
41+
- goprintffuncname # Checks that printf-like functions are named with f at the end
42+
- gosec # Inspects source code for security problems
43+
- gosimple # Linter for Go source code that specializes in simplifying code
44+
- govet # Vet examines Go source code and reports suspicious constructs
45+
- ineffassign # Detects when assignments to existing variables are not effectively used
46+
- misspell # Finds commonly misspelled English words in comments
47+
- nakedret # Finds naked returns in functions greater than a specified function length
48+
- noctx # Finds sending http request without context.Context
49+
- nolintlint # Reports ill-formed or insufficient nolint directives
50+
- nosprintfhostport # Checks for mismatched host and port separators in URL passed to net.SplitHostPort
51+
- prealloc # Finds slice declarations that could potentially be preallocated
52+
- predeclared # Finds code that shadows one of Go's predeclared identifiers
53+
- revive # Fast, configurable, extensible, flexible, and pretty linter for Go
54+
- rowserrcheck # Checks whether Rows.Err of rows is checked successfully
55+
- staticcheck # It's a set of rules from staticcheck
56+
- stylecheck # Stylecheck is a replacement for golint
57+
- unconvert # Remove unnecessary type conversions
58+
- unused # Checks Go code for unused constants, variables, functions and types
59+
- usestdlibvars # A linter that detect the possibility to use variables/constants from the Go standard library
60+
- wastedassign # Finds wasted assignment statements
61+
- whitespace # Tool for detection of leading and trailing whitespace
62+
63+
# Disable some noisy linters
64+
disable:
65+
# Too strict for this project
66+
- lll # Line too long (handled by gofmt)
67+
- funlen # Function too long (OK for archiver)
68+
- cyclop # Cyclomatic complexity alias (use gocyclo)
69+
- wsl # Whitespace is not consistent
70+
- nestif # Nested if statements (OK in some cases)
71+
- nlreturn # Named return statements not followed by newline
72+
- interfacebloat # A linter that checks the number of methods inside an interface
73+
74+
issues:
75+
# Maximum issues to show
76+
max-issues-per-linter: 0
77+
max-same-issues: 0
78+
79+
# Use default exclude directories
80+
exclude-dirs-use-default: true
81+
82+
# Exclude patterns
83+
exclude-rules:
84+
# Exclude tests from some rules
85+
- path: _test\.go
86+
linters:
87+
- gocyclo
88+
- errcheck
89+
- gosec
90+
- dupl
91+
- funlen
92+
- contextcheck
93+
- wrapcheck
94+
95+
# Exclude generated code
96+
- path: \.pb\.go$
97+
linters:
98+
- all
99+
100+
# Allow long strings in HTML
101+
- path: cache_viewer_html\.go
102+
linters:
103+
- lll
104+
- dogsled
105+
- funlen
106+
- gocyclo
107+
- gocognit
108+
- dupl
109+
110+
output:
111+
# Format output
112+
formats:
113+
- format: colored-line-number
114+
path: stdout
115+
116+
severity:
117+
# Set the default severity for unset linters
118+
default-severity: error
119+
120+
# Set the severity per-linter
121+
rules:
122+
- linters:
123+
- godox
124+
severity: warning
125+
- linters:
126+
- misspell
127+
severity: error

0 commit comments

Comments
 (0)