Clean Energy Consumer Portal Visual Redesign Plan
Information design plan to modernize utility customer portals, smart meter dashboards, and bill visualizations.
Use this template when restructuring consumer-facing utility portals and billing layouts to improve energy literacy and demand response participation. It delivers a structured information design and layout strategy.
Role: Lead Utility Information Designer and Behavioral UI Strategist focused on consumer energy transition.
Context
- Utility brand: {{utility_brand_name}}
- Consumer demographics: {{consumer_demographics}}
- Primary billing friction points: {{billing_friction_points}}
- Demand response and decarbonization targets: {{demand_response_goals}}
- Multi-channel delivery touchpoints: {{multi_channel_touchpoints}}
- Accessibility requirements: {{accessibility_mandate_level}}
Task
Create a visual information design plan for {{utility_brand_name}} that transforms complex kilowatt-hour usage, dynamic tariff rates, and billing breakdowns into clear visual stories across {{multi_channel_touchpoints}}, solving {{billing_friction_points}}.
Method
- Dissect {{billing_friction_points}} to locate confusing rate tier presentations, estimated reads, and hidden fees.
- Architect an intuitive visual data visualization model for interval smart meter consumption (daily, hourly, peak vs off-peak).
- Design behavioral visual nudges and comparison benchmarks (e.g., similar home comparisons) that motivate {{demand_response_goals}}.
- Standardize visual hierarchy across responsive web, mobile apps, and paper/PDF bills included in {{multi_channel_touchpoints}}.
- Select typography, numerical tabular fonts, and color semantics that demystify generation vs transmission charges.
- Integrate accessible data visualization techniques (patterns, direct labeling, screen-reader text) conforming to {{accessibility_mandate_level}}.
- Structure an iterative prototyping and user comprehension testing plan tailored to {{consumer_demographics}}.
Constraints
- Information architecture MUST NOT rely solely on color to communicate tariff tier changes.
- Data visualizations MUST be fully readable across small-screen mobile viewports without horizontal scrolling.
- Technical utility jargon MUST be paired with visual explanatory tooltips or progressive disclosure.
- Billing summaries must fit into a standardized single-page overview zone before deep-dive graphs.
Output format
- Information Design Strategy & Behavioral Objectives (max 250 words)
- Smart Meter Data Visualization Framework (chart types, intervals, benchmark visuals)
- Cross-Channel Bill & Dashboard Layout Hierarchy (responsive wireframe schemas)
- Color, Microcopy, and Data Legibility Standards (conforming to {{accessibility_mandate_level}})
- Usability Validation & Phased Rollout Plan (testing phases with {{consumer_demographics}})
Self-review
- Does the data visualization framework directly resolve {{billing_friction_points}}?
- Are behavioral nudges calibrated to drive {{demand_response_goals}}?
- Does the visual accessibility strategy meet {{accessibility_mandate_level}} across all {{multi_channel_touchpoints}}?
Explicit role, a named task, and discrete steps the model can follow.
Background, inputs and variables the model needs before it starts.
Hard boundaries — what the model must and must not do.
A named, field-level shape for the response.
Ordered work items that force analysis before an answer.
Length and structure that travel across frontier models.
Signal density — instruction weight without padding.
Documented variables so the scaffold adapts to new inputs.
Quality bar, assumptions and behaviour when inputs are thin.
How much real usage the template has behind it.