如何自己设计元素周期表?

您所在的位置:网站首页 我看一下元素周期表周期表图片 如何自己设计元素周期表?

如何自己设计元素周期表?

2023-03-31 12:50| 来源: 网络整理| 查看: 265

设计元素周期表,这事我干过。ヽ(✿゚▽゚)ノ

在2019年的时候,为庆祝元素周期表发现150周年[1],我们团队[2]设计一个化学元素周期表网站[3],里面收录了各种有趣的化学元素周期表。

网站的设计模型一、我们的元素周期表网站的设计

设计框架图中橙色部分为已经开发的界面,白色部分为尚未开发、正在筹备阶段的界面。根据科学-历史-人文的设计原则,我们设计了不同形式的元素周期表,如与科学相关的有元素性质周期表、同位素周期表、原子结构周期表、单质收藏周期表等,与历史相关的有元素周期表发展史、元素发现史等,与人文相关的有诗歌类周期表、成语词典周期表、顺口溜版周期表等,还有与艺术相关的系列卡通漫画周期表、周期表之歌,以及一些创意周期表等等,我们还将设计一些互动功能,鼓励使用者进行创新与分享。元素板块的分类与之类似。

网站设计框架(橙色板块已开发)

我们希望通过“趣●元素周期表”网站酷炫的科技、多样的形式、丰富的内容、前沿的科技、学科的融合、多感官的刺激、互动与创新等等,吸引受众对元素周期表的注意,激发他们的兴趣,感受化学之魅力!下面来看看我们的设计吧~

1、立体互动板块

在这个板块,我们是采用AR交互概念,你可以动动鼠标来拖动这个元素周期表,非常有交互性,很有趣!后期的想法是采用AR技术相关设备来升级这个板块,让其更有视觉冲击力!

下面是我截取的网站交互动图。(你可以手动去拖动这些元素,动手能力满满!)

这是螺旋形式的元素周期表,可以用鼠标拖动,有那种立体视觉效果。这是球形的元素周期表,也可以用鼠标拖动,实现交互。这是栅格版本的,后期做成AR交互,会给人一种冲出屏幕的震撼感!2、元素性质板块

元素性质板块,我们用的是扁平化设计,简洁直观,有一种浓浓的科技风~

电负性板块,可以点击方块来获取元素的电负性性质,通过颜色的深浅来比较电负性。原子结构板块3、情书元素周期表板块

由于其他的板块比较多,另外由于网站本身无法使用了,无法提取演示素材,我就主要放在这里来演示之前的设计。

三行情书版本,这里面你点击一个元素就会有关于它的三行情书。当时设计的还可以由读者提交自己的情书,我们筛选后可以放出你写的情书。4、实物元素周期表板块

这里面的图片要感谢我的好朋友 @a冥灵 提供。

二、艺术创意元素周期表设计

其实把元素周期表和生活实物结合起来,非常有艺术风格。可以看下这块的设计。

1、与食物结合巧克力元素周期表,馋了嘛?我要一口气吃完一整张元素周期表!2、与汽车涂鸦结合化学家的汽车?3、与泼墨艺术结合化学就是艺术!4、与玩具结合元素周期表魔方元素周期表手环5、与交通结合元素周期表地铁版!6、与服装结合三、其他的元素周期表设计

在做趣·元素周期表项目的时候,我们也收藏了很多有趣的元素周期表,在这里提供给大家。如果图片侵权,烦请告知,感谢~

1、元素立体性质比较元素周期表2、生化元素周期表3、生活物品科普版元素周期表4、元素相对丰度5、氧化态元素周期表6、八音律元素周期表7、实物元素周期表8、元素发现者元素周期表9、各种创意风格的元素周期表Periodic Table of Elements/Google lmage Top Results这是我设计的@ChemX,是我们的文化衫图片动漫元素周期表四、元素周期表有趣的网站、APP、书籍设计灵感

在这里推荐几个有趣的网站,可以找到很好玩的元素周期表设计灵感。

1、有趣的化学元素网站

1,嗨元素漫画网站[4],由美丽科学出品,这里面是拟人的化学元素,非常可爱!

我最喜欢氢妹妹氧妹妹

2,同位素网站[5],里面可以找到同位素,可以根据相关的数据设计。

2、有趣的化学元素APP

在手机上我推荐一个,元素周期表,在应用商店里面可下,里面内容非常全面。方便你很快查询。

3、有趣的化学元素书籍

《鬼脸化学课·元素家族》,作者 @鲁超 里面写了所有化学元素的故事,在设计元素周期表时候,可以用里面的故事作为设计灵感!

参考^IYPT2019^该项目由南师大副教授任红艳老师指导,王聪聪提出设计模型、网站框架及细节想法,宋佳琴、马彦君一起收集、翻译、整理或创新素材资源,张泽同学帮忙页面设计,最终由邵敏凯同学完成具体页面的开发、测试和优化(技术支持)。由理性边界科普团队鲁超、张越、程新等人一起完成网站的制作,也取得了许多热衷于科普的人士的支大力持。^趣·元素周期表网站项目,由于很久没使用了服务器使用过期了,现在这个网站是打不开的状态。 https://ele.mkcc.top/^嗨元素漫画网站 http://haiyuansumanhua.lofter.com/^同位素网站 http://www.isotopesmatter.com/applets/IPTEI/IPTEI.html


【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3