Interactive Periodic Table

summary

A detailed app showing all chemical elements with interactive details.

prompt

Create a detailed interactive periodic table of elements. The table should display all known chemical elements and, upon clicking an element, show its properties such as electronegativity, ionization energy, atomic mass, etc. Include filters at the bottom to sort elements by type (metals, gases, non-metals, elements with electric properties). Ensure the following: 

Project Overview
- Develop a comprehensive interactive periodic table.
- Include all known chemical elements in the table.

UI/UX Design and Flow
- Design a grid layout representing all elements.
- Upon clicking an element, display a pop-up with detailed properties.
- Include filters at the bottom for sorting elements by type.

Core Functionality and Logic
- Ensure click interaction displays element properties: electronegativity, ionization energy, atomic mass, etc.
- Implement sorting filters: metals, gases, non-metals, elements with electric properties.

Best Practices
- Optimize for user-friendly navigation and interaction.
- Ensure accessibility and responsiveness across devices.
- Provide a seamless experience with clear, informative pop-ups.

original prompt

Создай подробную интерактивную переодическую таблицу менделеева, при нажатии на элемент должны показываться все свойства элемента, такие как электроотрицатнльность энергия ионизации, и другие. Также снизу должны быть фильтры элементов по видам, металлы, газы, неметаллы, элементы с электрическими свойствами. Таблица должна включать в себя все известные химические элементы

Q: Какие именно свойства элементов нужно включить в интерактивную таблицу?
A: Электроотрицательность, энергия ионизации, атомная масса и т.д.

Q: Какое взаимодействие предполагается для фильтров?
A: Фильтрация элементов по типам с отображением соответствующих элементов

generation cost summary

model name: o3-mini-high

response time: 158.84 sec.

result tokens: 20,898

cost: $0.09259140