SitePoint发起为期四周的UI代码挑战赛，首个挑战赛主题为“心跳”，要求参赛者创作一个类似电影、电视和游戏中心跳UI动画。参赛作品需以CodePen形式提交，可以使用任何Web技术。
评选标准包括代码简洁性、有效性，UI外观和感觉的真实性，以及解决方案的巧妙性和创造性。一等奖获得100美元亚马逊礼品卡，亚军获得2个高级会员资格和SitePoint T恤。
挑战赛提供常见问题解答，涵盖自定义心跳动画、应用于其他形状、添加到网站、故障排除、增强真实感、更改颜色、添加声音以及商业项目使用等方面，并提供CSS动画学习资源。
我们经常看到电影、电视和游戏中令人惊艳的UI界面，而工作中的UI设计却常常显得枯燥。这次挑战赛，让您有机会创作有趣的作品，并赢取100美元亚马逊礼品卡！
挑战任务是创建一个动画ECG/EKG生物监测显示面板。可以使用任何技术，只要能以CodePen形式呈现即可，包括HTML/CSS、Canvas、SVG、WebGL、D3等。
通常，这些UI界面采用暗色模式，至少包含一条左右循环的曲线图，描绘心跳速率。可以添加其他元素（核心温度、血压等），但核心是起伏的心跳曲线。
参赛方法：将CodePen链接和简短说明发布在评论区。一个创意可以提交多个作品，但建议避免提交多个相似作品。
评选标准：代码简洁性、有效性；UI外观和感觉的真实性；创意性。
评审时间：挑战赛于6月5日星期三上午9:00（PST）开始，一周后（6月12日星期三上午9:00 PST）截止。
常见问题解答（FAQ）涵盖了自定义心跳动画、应用于其他形状、添加到网站、故障排除、增强真实感、更改颜色、添加声音以及商业项目使用等方面，并提供了CSS动画学习资源。
以上是UI代码挑战＃1-心跳的详细内容。更多信息请关注PHP中文网其他相关文章！
