![topimg-mc-lab](https://images.ctfassets.net/pwepcr3jaumx/4MpVrGP6AsT1znjfPKizLc/c4735d35789df4469f599a6ef288902d/topimg-mc-lab.png?w=1120&h=630&q=50&fm=png)
WEBSITE
モバイルコンピューティング講座
2022年
モバイルコンピューティング講座様
https://mc.net.ist.osaka-u.ac.jp/Webサイトのページ構造およびデザインの整理
HTML
SCSS
IoTや無線通信などに関する最先端の研究が日夜行われている大阪大学大学院情報科学研究科モバイルコンピューティング講座。旧東野研究室から現在の山口研究室に移行するのに伴って、Webサイトをリニューアルしましたが、サイトが無秩序に拡張されることでサイトの構造やデザインの一貫性が損なわれ、管理が難しい状況になっていました。そこで、こうした課題に対する改善を依頼されました。
改善は、コンテンツをその性質ごとに分類してURL構造を見直すところから始まりました。そして、サイトの構造とページの要素を整理した上で、従来のデザインを基盤にした新たなデザインを形作っていきました。
デザインは、視認性や利便性を重視して改善を加えています。前景色と背景色のコントラストを十分高めた配色を採用し、その上でアイコンを積極的に活用するなど、ストレスなく情報を見ることができる状態を目指しています。また、動画に対して違和感のない極限まで圧縮を加え、アイコン類にはベクター化による省容量化を行うなど、パフォーマンスの向上も図りました。
改善は、コンテンツをその性質ごとに分類してURL構造を見直すところから始まりました。そして、サイトの構造とページの要素を整理した上で、従来のデザインを基盤にした新たなデザインを形作っていきました。
デザインは、視認性や利便性を重視して改善を加えています。前景色と背景色のコントラストを十分高めた配色を採用し、その上でアイコンを積極的に活用するなど、ストレスなく情報を見ることができる状態を目指しています。また、動画に対して違和感のない極限まで圧縮を加え、アイコン類にはベクター化による省容量化を行うなど、パフォーマンスの向上も図りました。
続きを読む
![subimg-mc-lab-1](https://images.ctfassets.net/pwepcr3jaumx/2YgY4t68wHKlz6wG2guxmf/24b3d87c5563235f3000ce9ff3c44a64/subimg-mc-lab-1.png?w=1500&h=1420&q=50&fm=png)
![subimg-mc-lab-2](https://images.ctfassets.net/pwepcr3jaumx/5ZpgYUVmN962CJILezo08D/cc2a8f6d75a419d9815173a5c3048497/subimg-mc-lab-2.png?w=1500&h=1380&q=50&fm=png)
![subimg-mc-lab-3](https://images.ctfassets.net/pwepcr3jaumx/6lIdNEkjuc0k3qXlqx8Kxs/47b821b8bcad27d3aad07e94aa490263/subimg-mc-lab-3.png?w=1500&h=1520&q=50&fm=png)