蓋索林 Gasolin

人們總是高估一年可以完成的事,卻低估十年能完成的事

0%

Code Flower of Gaia - The firefox OS front end

[![](http://3.bp.blogspot.com/-A5omYli3oD8/VKy7ZhFdo4I/AAAAAAAADx4/lmK6VlkaxC8/s1600/%E8%9E%A2%E5%B9%95%E5%BF%AB%E7%85%A7%2B2015-01-07%2B%E4%B8%8B%E5%8D%8812.51.22.png) ](http://3.bp.blogspot.com/-A5omYli3oD8/VKy7ZhFdo4I/AAAAAAAADx4/lmK6VlkaxC8/s1600/%E8%9E%A2%E5%B9%95%E5%BF%AB%E7%85%A7%2B2015-01-07%2B%E4%B8%8B%E5%8D%8812.51.22.png)
There are [several source code visualization](https://www.codefellows.org/blog/visualizing-the-history-of-node-js-via-git-commits) tools available for choose. I've tried [Code Swarm](https://code.google.com/p/codeswarm/) long time ago and this time I'd like to try something that can be done on web directly. So, here's the [Gaia source code visulization](http://gasolin.github.io/CodeFlower/) rendered by [CodeFlower](http://redotheweb.com/CodeFlower/) via [D3.js](http://d3js.org/).

The prosperity of blossom denotes different

[![](http://1.bp.blogspot.com/-Vthdxeyf8Eo/VKy89BNpqaI/AAAAAAAADyE/mBdj3ZX7ASc/s1600/%E8%9E%A2%E5%B9%95%E5%BF%AB%E7%85%A7%2B2015-01-07%2B%E4%B8%8B%E5%8D%8812.57.51.png) ](http://1.bp.blogspot.com/-Vthdxeyf8Eo/VKy89BNpqaI/AAAAAAAADyE/mBdj3ZX7ASc/s1600/%E8%9E%A2%E5%B9%95%E5%BF%AB%E7%85%A7%2B2015-01-07%2B%E4%B8%8B%E5%8D%8812.57.51.png)
Orange is the settings app flower. The upperside are modulized setting panels. We can see good order of them. The downside crowds are things that not that modularized.
[![](http://2.bp.blogspot.com/-KYFYxGwq86A/VKy-cCI-5dI/AAAAAAAADyQ/cuUaw_LCZrA/s1600/%E8%9E%A2%E5%B9%95%E5%BF%AB%E7%85%A7%2B2015-01-07%2B%E4%B8%8B%E5%8D%881.03.23.png) ](http://2.bp.blogspot.com/-KYFYxGwq86A/VKy-cCI-5dI/AAAAAAAADyQ/cuUaw_LCZrA/s1600/%E8%9E%A2%E5%B9%95%E5%BF%AB%E7%85%A7%2B2015-01-07%2B%E4%B8%8B%E5%8D%881.03.23.png)
The purple sparkled flower is gaia web components. The main part is gaia-header, the top left part is gaia-grid.
[![](http://3.bp.blogspot.com/-aADuKdPoumA/VKy_fsik7WI/AAAAAAAADyk/CrMWTIDgchg/s1600/%E8%9E%A2%E5%B9%95%E5%BF%AB%E7%85%A7%2B2015-01-07%2B%E4%B8%8B%E5%8D%881.08.21.png)](http://3.bp.blogspot.com/-aADuKdPoumA/VKy_fsik7WI/AAAAAAAADyk/CrMWTIDgchg/s1600/%E8%9E%A2%E5%B9%95%E5%BF%AB%E7%85%A7%2B2015-01-07%2B%E4%B8%8B%E5%8D%881.08.21.png)

The system app is a flower with a more concrete shape.

[![](http://3.bp.blogspot.com/-Chy7pnUtwLA/VKy_9F84vUI/AAAAAAAADys/u6VfY--3iVQ/s1600/%E8%9E%A2%E5%B9%95%E5%BF%AB%E7%85%A7%2B2015-01-07%2B%E4%B8%8B%E5%8D%881.10.56.png)](http://3.bp.blogspot.com/-Chy7pnUtwLA/VKy_9F84vUI/AAAAAAAADys/u6VfY--3iVQ/s1600/%E8%9E%A2%E5%B9%95%E5%BF%AB%E7%85%A7%2B2015-01-07%2B%E4%B8%8B%E5%8D%881.10.56.png)
The calendar app (in yellow) looks like a pretty Dandelion.
[![](http://1.bp.blogspot.com/-e2QDiaJBwTE/VKzAcvmIm1I/AAAAAAAADy0/1rhVYaG1Ajo/s1600/%E8%9E%A2%E5%B9%95%E5%BF%AB%E7%85%A7%2B2015-01-07%2B%E4%B8%8B%E5%8D%881.12.53.png)](http://1.bp.blogspot.com/-e2QDiaJBwTE/VKzAcvmIm1I/AAAAAAAADy0/1rhVYaG1Ajo/s1600/%E8%9E%A2%E5%B9%95%E5%BF%AB%E7%85%A7%2B2015-01-07%2B%E4%B8%8B%E5%8D%881.12.53.png)
 What about others? go [Gaia source code visulization](http://gasolin.github.io/CodeFlower/) and check by yourself. (The repo is a digest from 2015/1/7 master)

And you can make your own by forking CodeFlower from github.