Martin Fowler
·
使用大型语言模型构建TMT镜面可视化
内容提要
本文记录了使用大型语言模型（如Claude）构建三十米望远镜主镜用户界面的过程。尽管缺乏D3.js和UI开发经验，作者通过逐步提示成功创建了由492个六边形组成的对称结构，强调了迭代提示的重要性，并在构建中学习新技术，最终获得了可用原型和对相关代码的深入理解。
关键要点
-
本文记录了使用大型语言模型（如Claude）构建三十米望远镜主镜用户界面的过程。
-
作者缺乏D3.js和UI开发经验，但通过逐步提示成功创建了492个六边形组成的对称结构。
-
强调了迭代提示的重要性，逐步引导AI生成所需代码。
-
目标是创建一个基于HTML的可视化界面，展示三十米望远镜的主镜。
-
初始提示未能达到预期效果，决定采取逐步方法进行调整。
-
通过逐步绘制单个六边形，确认基础构建块的有效性。
-
在添加第二个六边形时，调整坐标以实现正确对齐。
-
创建第二行时，几次尝试后成功实现了斜边的对齐。
-
扩展为对称结构时，采用环形布局方法以模拟圆形对称性。
-
通过减少中心空隙，最终获得了符合设计要求的圆形结构。
-
为每个六边形段添加编号和工具提示，确保信息的准确显示。
-
经验教训包括：大型语言模型帮助快速入门，提示需要迭代，构建过程促进学习。
延伸解读
迭代提示的重要性
在构建复杂用户界面的过程中，迭代提示显得尤为重要。作者通过逐步调整提示，逐渐明确了需求，最终成功生成了符合设计要求的代码。这一过程不仅提高了代码的准确性，也加深了对所用技术的理解，提醒读者在使用大型语言模型时应保持灵活性和耐心。
从小处着手
作者强调了从简单构建块开始的重要性。在创建用户界面时，先绘制一个六边形并确认其正确性，为后续的复杂结构打下基础。这种方法不仅降低了出错的风险，也使得整个构建过程更加高效，适合初学者在面对新技术时采用。
几何布局的挑战
在构建对称结构时，几何布局的复杂性不可忽视。作者经历了多次尝试，最终通过调整坐标和行数实现了理想的圆形对称性。这一过程提醒开发者在设计时需仔细考虑几何关系，尤其是在涉及多个元素的布局时。
延伸问答
如何使用大型语言模型构建三十米望远镜的用户界面？
通过逐步提示，使用大型语言模型（如Claude）创建492个六边形组成的对称结构，最终实现HTML可视化界面。
在构建过程中遇到了哪些挑战？
初始提示未能达到预期效果，布局不够对称，需要通过逐步调整和多次尝试来实现正确的几何对齐。
为什么迭代提示在这个项目中很重要？
迭代提示帮助逐步引导AI生成所需代码，确保每一步都符合设计要求，从而提高了最终结果的准确性。
如何确保每个六边形段的信息准确显示？
为每个六边形段添加编号和工具提示，确保在鼠标悬停时显示正确的段信息。
使用大型语言模型的经验教训是什么？
大型语言模型帮助快速入门，提示需要迭代，构建过程促进学习，最终获得可用原型和对相关代码的深入理解。
构建三十米望远镜用户界面的最终目标是什么？
创建一个基于HTML的可视化界面，展示三十米望远镜的主镜状态，确保结构的对称性和信息的准确性。
