My PUB101 content lives in the space between a standalone blog and an entry within my projects. This comes from my transitional stage between static HTML and a dynamic site with a static site generator. Now that I can produce a blog using `middleman-blog`, I can begin to consolidate these pages into two “blog” classes. Since conception, my site has been centered round the idea of showcasing my projects and photography. I have been inspired by similar blogs and portfolios that center around photography, data visualization, and software design. Further, creators like POSY, N-O-D-E, and Think Twice have contributed to my desire for clean design and communications philosophy. Theoretical background in data communication, information theory, and academic writing has inspired me to take the Edward Tufte approach of minimizing chart junk and maximizing data-ink ratio in my visualizations and web design across the board.

When it comes to designing the semiotics and user layout of the site, I have taken inspiration from a large suite of personal website and blogs including the following. There are more I just lost track!

A lot of these websites (including my original inspiration which I can no longer find) are build with static site generators like Middleman and Ruby on Rails. The simplicity and clever balance of text with icons has drawn me in. The style of many of these sites is a clever balance of minimalism with purposeful style to craft a personal narrative. Several of the examples use monospace text and figures in a way that mirrors academic articles of the 20th century when it analog printing presses still used monospace ligatures and figures. I have borrowed some elements from these sites including for my project cards, blog lists, and responsive galleries.

The structure of my personal website at the moment is that of a gallery stitched to a projects page, with some personal narrative to act as a mini resume. My main focus is to deliver photos from events or projects I put together, as well as consolidate the work I have done on personal projects between creative and tech endeavors. This has led to several base layouts for my website. While I have tried to maintain a coherent theme, I feel like I could tie them together more consistently (ie. Some buttons are rounded while others have sharp corners). Figure 2 shows the visual breakdown of my site. My header and footer--drawn in black--are consistent between all pages. I then use coloured arrows to draw attention to how the layouts of different sections vary. Finally both the Projects and PUB101 pages link to a generic content page style for body copy. A big benefit of moving to Middleman is that I can now define a design element in one place, and then reuse it across the site. This also means that if I want to update them, I only have to change one block of code to update across the site (: this would make me sad if I had to do it the old way...