Interactionalex 2.0

My second portfolio website

skyskysky

For some reason I always end up working on my portfolio website when I do not have the time nor the money do to it properly. Still, a step in the right direction.

Was about time to revamp my portfolio website. Partly because my style changed quite a bit in the last 2 years, and partly because of the upcoming massive mobile incompatibility with flash based content. And while Flash still holds up against HTML5, that is just because the latter is still young, and the existing tools to work with it are awful for everyone but developers. Me, personally, while a make a heavy use of code into my Flash prototypes, I really need a graphical user interface with WYSIWYG preview, since most of the time I like to adjust the design while working on the implementation, which saves me a lot of time.
However, technology moves on, and while I’m waiting for Adobe to put some effort in allowing Flash to publish its projects in HTML5, I had to update my website to make it more accessible, good looking, easy to maintain and overall more representative of my current design style.

I opted for this aesthetics when I was working on the wireframes for another website, and I realized that they look very slick as simple as they where, so I decided to use the same style for my new website. Once the design of the various page was finished, I realized a full prototype in Flash, then I imported all the assets in Photoshop in order to produced all the bits and pieces that could not be realized directly

with CSS and provided them to my friend and developer Nicola Peduzzi, that wrote the style sheets and integrated the whole thing into WordPress.

Design notes

The website takes advantage of the latest standards, such as CSS 3.0 and HTML5 and such, but I was not really looking for something too flashy (look what I’ve done here).
Style-wise I put a lot of effort in achieving a clean look, minimal but recognizable, relying mainly on typography to visually define the various elements in the pages, with thin fonts, medium contrasts, strong color accents and big, high resolution images. The purpose of this is to maximize the focus on the contents rather than the interface.
As I always like to do, I started by creating a logo, the A+ logo, that served the purpose of focalizing the identity elements into a symbol, that could be used later on for the Facebook page profile image, mobile apps, company logo and whatnot. There isn’t any plan to do such things at the moment but you never know.
One interesting thing I discovered while trying to use web fonts is that Windows 7 is still pretty much unable to display them the way it most definitively should. For this reason on the Mac the website will look just a bit nicer, including iOS devices.

Role and Team

Alessandro Filippi (UX Design, Visual Design)
Nicola Peduzzi (Developer)

Programs

Photoshop Extended CS5, Illustrator CS5, Flash Professional CS5

Platforms

Web
Web mobile
iOS (iPhone +retina, iPad +retina)

Links

The website is no longer available.