Skip to main content

UI Component Recommendation Prompt

Screen Description

[Provide a detailed description of the screen's purpose, primary user tasks, and key information to be displayed. Example: "A screen for utility technicians to view and validate meter readings, identify anomalies, and approve or flag readings for investigation."]

User Context

  • Primary users: [Who will use this screen? Example: Field technicians, billing administrators]
  • User goals: [What are users trying to accomplish? Example: Quickly review readings, identify outliers]
  • Frequency of use: [How often will users interact with this screen? Example: Daily, throughout shift]

Technical Requirements

  • Data complexity: [Simple/Medium/Complex - how much data needs to be displayed?]
  • Device considerations: [Desktop-only, responsive, mobile-first?]
  • Performance considerations: [Large datasets? Real-time updates?]

Functional Requirements

[List key functions the screen needs to support] Example:

  • View list of meter readings
  • Filter readings by status/date/location
  • Approve/reject readings
  • Add notes to suspicious readings
  • View historical reading patterns

Based on the above description, please provide:

  1. A complete list of recommended UI components for this screen from the following component library:

General

  • Button
  • FloatButton
  • Icon
  • Typography
  • Layout
  • Divider
  • Flex
  • Grid
  • Layout
  • Space
  • Splitter

Navigation

  • Affix
  • Breadcrumb
  • Dropdown
  • Menu
  • PageHeader
  • Pagination
  • Steps

Data Entry

  • Autocomplete
  • Cascader
  • Checkbox
  • ColorPicker
  • DatePicker
  • Form
  • Input
  • InputNumber
  • InputNumberLegacy
  • Mention
  • Radio
  • Rate
  • Select
  • Slider
  • Switch
  • TimePicker
  • Transfer
  • TreeSelect
  • Upload

Data Display

  • Avatar
  • Badge
  • Calendar
  • Card
  • Carousel
  • Collapse
  • Comment
  • Descriptions
  • Empty
  • Image
  • List
  • Popover
  • QRCode
  • Segmented
  • Statistic
  • Table
  • Tabs
  • Tag
  • Timeline
  • Tooltip
  • Tree
  • Tree View

Feedback

  • Alert
  • Drawer
  • Message
  • Modal
  • Notification
  • Popconfirm
  • Progress
  • Result
  • Skeleton
  • Spin

Other

  • Anchor
  • BackTop
  • WaterMark
  • CheckList
  • HashCode
  1. Component arrangement suggestions
  2. Specific configuration recommendations for complex components
  3. Navigation and workflow considerations
  4. Any UX best practices specific to the utility industry for this screen type

Please organize components by:

  • Primary content area
  • Secondary/supporting areas
  • Navigation elements
  • Action elements
  • Feedback/status elements