对于我和我的搭档Erin，我们完成了一个基于音乐的项目，该项目使用户可以与来自不同时代（1980-2010年代）的不同音乐艺术家进行互动。 我们想创建一个有趣的，包容性的项目，既可以教育又可以娱乐。 我们知道音乐是与许多人相关的主题，因此我们决定创建一个基于鼠标的交互式站点，以查看专门针对热门艺术家的页面，包括事实和样本歌曲。 在1980年代，我们以麦当娜，迈克尔·杰克逊和普林斯为特色。 在1990年代，我们精选了Backstreet Boys，Mariah Carey和Elton John。 在200年代，我们推荐Jay-Z，Pink和Beyonce。 对于2010年，我们推荐了Drake，Lady Gaga和Taylor Swift。 我们最初的概念化（图1）是一个主标题屏幕，其中的按钮反映了我们想要包含的音乐时代。 每个按钮将进入一个缓冲页面，显示年份和3位音乐艺术家。 我们概念化地具有4个缓冲页面和12个艺术家页面。
在最终设计中，我们直接遵循了原始设计。 我们仅选择了较小的美学设计选择，例如布局，颜色主题和字体。 对于标题页面（图2），我们将标题居中，顶部将按钮居中。 我们引用了另一个创建者的代码来创建此声波，并从屏幕的右侧向左侧移动。
图3是用户选择标题屏幕上的按钮后缓冲页面之一的示例。 每个缓冲区页面都有不同的颜色示意图，范围从粉红色，蓝色，橙色和绿色。 我们决定使用不同的颜色来区分每年。
图4是艺术家页面之一的示例，一旦用户从缓冲区页面中选择了一个按钮。 除了艺术家的事实外，还有一个“播放”和“停止”按钮供用户控制音频，还有一个“返回”按钮可将其重定向回标题页。
我们的大多数挑战都围绕着该项目的鼠标交互性方面。 首先，弄清楚mousePressed函数与我们的页面和按钮的位置是非常令人困惑的，但是一旦我们获得了一些指导，那就很容易解决。 如果有更多时间，我希望通过将音乐视频添加到艺术家页面或将反映特定年份的歌曲混搭添加到缓冲页面来使程序界面更加精致。
总的来说，我真的很喜欢CSCI 187。 即使我上课是为了满足要求，但与其他班级形成了鲜明的对比，这使我与繁重的阅读和写作有所不同。 我认为实验室非常互动且充满挑战。 这是每周展示我们所有课程和知识的好方法。 这门课程使我对Web设计和编程有了新的认识，赞赏开发代码所付出的所有努力。
请尽情享受并与Erin＆I的音乐项目互动！
