[Project Proposal] Portfolio Re-Design – Nicholas Lucaccioni

Portfolio Site Re-Design

Goal/Concept statement

My current portfolio site is rather bland, boring, and overall I have come to dislike more and more. In this project, I set out to completely redesign my site from scratch, without the use of a site builder, such as Wix, or Adobe My Portfolio, as I had for my original site. Instead I will use Webflow to build my site. I aim to create a much more unique experience that presents my work in an engaging way.

Live Site: www.lucadsgn.com

artboard.png

Development Stages

Phase 1: Define

I will be creating a live and viewable website that will replace my old portfolio in an attempt to better present my work and myself as a designer. I expect this site to include an engaging layout and transitions. The audience for this site would be potential employers and clients as well as fellow industry professionals.

Phase 2: Shape

In an effort to create a unique experience, I explored several different concepts. I had originally focused on only my 3D work and how to create an experience that presented the work uniquely. To this end, I first created a static layout in Sketch to figure out what sort of aesthetic I wanted.

I then moved on to the idea of using transitions and animation in the presentation of my work. I came up with 2 different ideas for this. The first would be to use a set of image carousels that would be constantly rotating but would slow in rotation if you hovered over one. The other idea was to create a sort of network of connected vector points that would be constantly moving and interact as you moved your cursor around the screen.

Then as I began to create the live site, I decided to incorporate elements from these previous explorations, using a fairly standard grid when presenting my branding work and using a parallaxed network of images for my 3D work.

Phase 3: Make/ Prototypes

During the prototyping phase, I used a couple programs. These included Sketch to create a static layout and then later After Effects to create concepts for transitions and show concepts for interactivity. For the final design and live site, I used Webflow.

From the static layout created in Sketch, I was able to establish a design aesthetic that I used in subsequent prototypes and eventually the final product.

After some user testing and feedback from my concept animations, I learned that while the vector grid was more engaging and unique, the carousel was more straightforward.

Using Webflow, I created the live final version of the site. Using the design aesthetic I had established earlier, as well as taking a couple of the ideas from the transition concepting phase and incorporating them into the site.

Phase 4: Launch

In order to launch the site, I will link the Webflow project/site to my domain name that I already have. By doing this, I can make changes to the site in the future through Webflow that will update the live site automatically.

Questions?

Is there a way I could make the branding grid more engaging so it has a similar focus draw as the 3D section of the site?

How might I add a video/animation to the site?

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

w

Connecting to %s