Research Publication

I designed my research website keeping in mind user experience: ease of site navigation as well as keeping technical contents as accessible and lucid as possible for urban designers and planners, as well as engineers. The challenge was balancing the professional and playful themes to increase the user base of our team's software tool to those who may not be as well versed to thermodynamics and building science.

The website has been upgraded from the previous design by the former researcher. This website is responsive and adjusts appropriately for various screen sizes and is built with twitter bootstrap framework. The user interface is improved with compelling and clear hierarchy, intuitive call to action, and illustrations of technical contents. The site is interactive and users can send us email messages via contact form.

MS Thesis | 2013 - 2015

Programming LanguagesJavascript, HTML, CSS

Content-Focused Approach

Simple page layout helps users to focus on content. In the new design, the button clearly indicates to users the next step: click on the link to download Urban Weather Generator [in the original design, the picture is a download link and requires a text below to clarify it.

Intuitive Call to Action

The four images on the left are the only links to access the weather data. It’s not clear they are clickable even after reading the paragraph above it. In the new design, the data availability is obvious at quick, supported by the unified look of buttons throughout the site.

Usability: Easy Access to Information

This section accompanies the simulation tool downloadable from this website and provides helpful tips for more advanced users who wants to dig into the plain text file created by the GUI. The new page shifts focus to explaining the significance of each parameter to city-scale thermodynamics, instead of the structure of the xml file as done before, which is clear from sample file included in the download package.

Previously users needed to click back and forth between each parameters to see their definitions, but on the new website they can scan via sidebar navigation and by name used exactly in the text file. This new documentation also includes urban design recommendations to reduce urban energy consumption as well as recommended values. The sticky navigation increases the accessibility to large amount of information on the website.


Team head-shots put faces to the research project. The About page is moved from the top page and replaced by projects overview to emphasize the intent of this project to share our research efforts.