在这个项目中，我们将构建一个 16x16 LED 矩阵。它具有如下特征：

• 带有 256 个 LED 的 LED 矩阵，这些 LED 都可以单独控制
• 托管在微控制器上的网页，它允许您
• 从矩阵上的网页实时创建像素艺术
• 可保存创作
• 循环显示所有以前的创作

第 1 步：使用哪些 LED？

对于这个项目，我决定使用 60 个 LEDs/m 的 WS2815 LED 灯条。

每个 LED 都有一个小型 IC，因此我们可以使用数据线和“ FastLED ” 等 Arduino 库单独控制每个 LED 的颜色和亮度
由于 LED 呈条状，我们基本上不必焊接
它们由 12V DC 供电。这比 WS2812B 等更便宜的替代品要好，因为您需要一个安培数更小的电源（下一步会更多）
有备份数据线，如果LED坏了
如果您找到合适的电源（请参阅下一步），理论上您也可以使用更便宜的 WS2812B LED 灯条。这样做的好处是，您可以直接为微控制器供电并且不需要降压转换器，但我建议使用 WS2815，因此我的代码和说明基于它们。

第 2 步：电源

当使用白色和全亮度时，这些小型 LED 会消耗大量电流。根据制造商的说法，一个 LED 最大需要大约 0.3 瓦。有 16*16=256 个 LED，我们需要一个 256*0.3W=76.8 瓦的电源。电压为 12V，这意味着 76.8W/12V=6.4A。为了有一些安全余量，我选择了一个 12V 7A 的笔记本电脑电源。在限制软件中的亮度时，您可能会少得多，但我更喜欢安全一点。

回到 WS2812B 条纹，它们每个 LED 的功耗也约为 0.3 瓦。当我们将 76.8 瓦除以 5V 以获得所需的电流时，我们看到这将约为 15.36A！

第 3 步：微控制器

我在这个项目中使用了 NodeMCU 板。它具有 WiFi、USB 转 UART（您可以通过 USB 对其进行编程）和一个板载稳压器，因此使用起来相当容易。不幸的是它不能由 12V 供电，所以我需要一个降压转换器来调节电压。在我的机箱中，我使用了一个带 USB 输出的机箱，所以我可以只使用 USB 电缆连接电路板。

除了 NodeMCU，我还使用了带有相应读卡器的 SD 卡来存储：

• 网页的 HTML/CSS/js
• 我使用网络应用程序创建的已保存像素艺术
• 像素艺术的名称，以便我可以在网页上选择它们

第 4 步：做一些测试
为了完成材料清单，我需要测试两件事：

什么用作 LED 的扩散器
LED 到扩散板的距离

第 5 步：扩散器

首先，我测试了 3 毫米厚的蛋白石聚苯乙烯。但是正如您在第一张照片中看到的那样，网格的线条模糊且没有我希望的那么清晰。然后我尝试了 1 毫米厚的普通聚苯乙烯，它看起来很棒，但它吸收了太多光线，所以我们必须让 LED 一直处于全亮状态。（第2张照片）最后我买了一些亚克力玻璃并使用了很多细砂纸使它看起来磨砂。（第 4 张照片）在我看来，它看起来是最好的。

第 6 步：扩散器和 LED 之间的距离

在 LED 和扩散器之间保持正确的距离至关重要。如果距离太大，我们会失去亮度，如果距离太小，像素将不会被完全填充并且在角落有圆边。我 3D 打印了一些测试件，非常喜欢 14 毫米距离（左起第二个）的外观。

第 7 步：CAD

基于这个设计选择和一些额外的测量，我在 Fusion 360 中设计了整个矩阵。 如果你想自己编辑一些东西或者只是想看看它的外观，你可以在谷歌驱动器链接中找到该文件以及其他必要的文件我将在此 Instructable 期间提供。

最后，我们可以制作我们的材料清单并开始建造！

第 8 步：材料清单

电子产品：

• NodeMCU v3
• SD卡（大小无所谓^^）
• SD读卡器
• 256 个 WS2815 LED 在 60 LEDs/m 条带中
• 电源 12V 7A
• 直流插孔
• 12V 至 5V 降压转换器
• LED 的连接夹（如果您不想焊接LED 灯条）
• 一些（跳线）电缆

五金店的材料：

• 3 毫米厚 MDF 用于盒子（尺寸取决于激光切割机的工作空间和布置）
• 用于垫片的 3 毫米厚 MDF（30 厘米 x 30 厘米）
• 用于网格的 3 毫米厚 MDF（30 厘米 x 30 厘米）
• 用于网格的 2x 4 毫米厚 MDF（30 厘米 x 30 厘米）
• 磨砂玻璃（29 cm x 29 cm 请参阅“扩散器”步骤）
• 一些 1 cm x 1 cm 方形木头

工具：

• 烙铁
• 激光切割机（也许可以联系您当地的 FabLab/hackerspace/激光切割服务）
• 3D打印机

文件：点击此处下载

第 9 步：激光切割

您只需要 3 个材料：

1. 1x LED 垫片将 LED 灯条固定到位（3 毫米 MDF）
2. 2x 网格，这将为我们提供 LED 和扩散器之间的测试距离（4mm MDF）
3. 1x 带有黑色涂层的网格（我用了 3 毫米），所以你通过磨砂玻璃看到的条是黑色的。您也可以再次使用 4 毫米普通 MDF。

盒子（3 毫米 MDF）

我在全功率下使用了 60W 激光器，工作空间为 60x40 cm。对于 4 毫米 MDF，它需要 2-3 次重复。

盒顶.dxf点击下载
盒子.dxf点击下载
LED网格.dxf点击下载
LED间隔条.dxf点击下载

第 10 步：粘合外壳

现在开始放下盒子的前部，然后放上侧板。不幸的是，它们不是很紧，所以我用了一些木胶将它们固定在一起。我们稍后会处理背板，所以让我们让胶水有时间变干，然后继续下一步。

第 11 步：安装 LED

首先将 LED 灯条切成 16 个部分，每个部分有 16 个 LED。然后使用连接器连接条带。如果将连接器的针脚向上弯曲一点，则插入它们会容易得多。当您没有连接器时，您现在必须焊接条带。请注意，它们必须以正确的方向连接。每个 LED 旁边的小箭头告诉您数据线的方向。它必须以蛇形/蛇形连续并从左下角开始，否则代码将无法工作（照片）。小心不要短路任何东西，连接器的颜色编码不正确。

之后从左下角开始将 LED 放入孔中。我用一些胶带把它们压下来。这个过程可能有点繁琐，但在此之后，大部分工作已经完成。

我建议将两根电线焊接到条带顶部的 + 和 -（在照片上用黑色箭头标记），这样我们就可以在顶部和底部馈入电流，以获得均匀的亮度，并减少 LED 和电线加热的问题.

第 12 步：外壳适配调整

外壳设计得非常紧（这不是错误，这是一个功能），因此我们现在无法将带有连接器的板安装在其中，因为连接器的电缆挡住了路。为此，我设计了一个小的 3D 打印部件，我们将连接器以一定角度粘在上面。首先将 3D 打印部件固定到木头上，然后使用一些（热）胶固定连接器。通过这样做，带有 LED 的板将最终装入外壳中，并且 LED 灯条被固定。

我有一台相当大的 3D 打印机，所以我可以一次性打印 29 厘米的部分，但我还包含了一个文件，其中将其分成两个较小的部分。

LED 安装 small.stl

LED灯座.stl

第 13 步：组装全部部件

最后，我们可以将所有这些激光切割/打印部件放在一起。首先按以下顺序将激光切割件插入盒子中：

磨砂玻璃
带黑色涂层的网格 (3mm)
网格 (4mm)
网格 (4mm)
LED 垫片与胶合在 LED 灯条上
为了将这些部件固定到位，我使用了一些 1 厘米的方形木块和热胶。（照片）

硬件部分就这样完成了，接下来让我们看看电子设备：

第 14 步：连接 SD 卡

我将电子部分拆分为将 SD 卡连接到 NodeMCU 并将电源与 LED 连接。

我们将按如下方式连接 SD 卡：

SD卡➞ NodeMCU
地 ➞ 地
3.3V ➞ 3V
CS ➞ D8
MOSI ➞ D7
SCK ➞ D5
MISO➞ D6
我使用母-母跨接电缆进行连接。

第 15 步：连接 LED

让我们来处理 LED。连接它们非常简单：

12V 至 DC-Jack 的 + 端子

GND 到 DC-Jack 的 - 端子和NodeMCU 的 GND

DI（数据输入）和 BI（备份输入）到 NodeMCU 的引脚 3

重要提示：确保 NodeMCU 和 LED 具有公共接地，否则数据信号将无法工作，因为您知道，闭合电路等。这就是我们将 LED 的 GND 连接到 NodeMCU 的 GND 的原因。

为了将 DC 插孔安装在外壳中，我在外壳上钻了一个孔并将其插入。钻孔的位置取决于您的用例。我在底部钻了它，因为我想把它挂在墙上，但如果你想让它立在桌子上，你也可以在后面钻它。

第 16 步：为 MCU 供电

要直接为 NodeMCU 供电，您需要 3.3V 电源。另一种方法是通过 microUSB 端口上的 5V 为其供电。无论哪种方式，我们都需要下台。我选择了第二个选项，并选择了带有 USB 输出的 HW-676。我将 + 连接到电源的 12V，- 连接到 GND，并使用短 USB 电缆连接 NodeMCU。

第 17 步：软件编程

我尝试尽可能好地注释 HTML/CSS/javascript/arduino 代码，并添加一些解释，如果您想查看代码或稍后添加功能。然后我用ESP8266Webserver 库编写了一个简单的 Web 服务器，它可以解析来自网站 js 的 POST 和 GET 请求，并据此控制 LED。在谷歌搜索琐碎的事情之后，不仅访问了一次 StackOverflow 并且访问了许多许多 chrome 标签，我真的很喜欢这个结果，即使它可以改进很多。（详细教程查看点击）

第 18 步：刷入 NodeMCU 并准备 SD 卡

准备SD卡很简单：将index.html（这里无法上传，请使用驱动链接）复制到SD卡根目录即可。闪烁不是那么简单：

因为 NodeMCU 不是官方的 Arduino 板，所以您必须添加外部板管理器。如果您以前从未使用过 ESP8266 或者甚至还没有 ArduinoIDE，请按照本教程进行操作：https://create.arduino.cc/projecthub/najad/using-...
打开草图并将顶部的 SSID 和密码更改为您的 WIFI 凭据
在“工具”下选择正确的端口并点击flash！
检查串行监视器的 IP 地址，您可以在该地址下找到 Web 应用程序。
如果您遇到任何错误，请随时发表评论，我会尽快回复

arduino_web_server.ino

第 19 步：Web 应用程序简介

当您在给定端口上打开网站时，您将看到此 UI。我将简要说明按钮和功能：

• 笔：左键单击以使用所选颜色绘制像素
• 橡皮擦：左键单击擦除一个像素
• 桶：左键单击以使用所选颜色填充相同颜色的区域（等到它在矩阵上完成后再使用）
• bin：清除画布
• 保存：点击保存当前图片
• WIFI：在两种模式之间切换：
• 将 Web 应用程序上的实时绘图同步到画布
• 不同步绘图并循环显示所有保存的图片
• 加载：选择要加载到 Web 应用程序和矩阵上的模式
• 从 SD 卡中删除花样

第 20 步：粘贴背板

现在您只需将背板粘在外壳上，我们就完成了该项目的制作。

补充：扩展项目的灵感和想法

现在轮到你了，如果你想扩展你的矩阵，这里有下列思路供参考：

• 让它更简单
• 使其对触摸设备负责和兼容
• 添加制作动画的功能
• 添加一个功能来玩蛇之类的游戏
• 让它根据天气显示一些东西
• 使它成为octoprint的状态栏
• 添加运动传感器
• 还有什么让你想到的！