Working with other creatives is always more of a collaboration than a typical project. I've worked with Mary on many of her mural projects and was delighted when she asked me to redesign her website. In our kickoff meeting, we discussed the pain-points of her current website, and the merits of other artist sites she admired. I synthesized these findings with a user-centered approach into a new adaptive site, with special versions for desktop, tablet, and mobile devices. This is what she had to say about her finished website:
I met with Mary to discuss the redesign of her website. We talked about the styling, structure, content, and identified the pain points of her current site. Also, we examined other artist sites and made notes of inspirational interfaces. I synthesized these findings into a cohesive project plan.
From the project plan, a site diagram was created. This new structure was clear, concise, and resolved all of the pain points of her existing website.
I created a style guide and defined the typography, colors, buttons, effects, and interactive background. I presented this, made refinements from feedback, and built a UI Kit of reusable elements.
Once the UI kit and site map was established, I developed a test site. I collected images and text and built-out the entire adaptive site. This included separate versions for desktop, tablet, and mobile devices. Once completed, Mary enlisted the help of her students to test the site on multiple devices. The testing uncovered one usability issue on mobile and I delivered an acceptable design solution.
The Home page incorporates a VR tour from her show at Treason Gallery, and stays fresh by displaying her Instagram feed. The Walls page showcases her mural work, with details of each project on separate pages. Its intended audience is corporate clients who may want to commission a mural. The Paintings page, designed for collectors, has a curated selection of her paintings. The Process page, created for her students and other artists who want to see her techniques has a brief introduction about her inspiration and pulls in data from her Tumblr feed. Last we have her Profile page. This combines her previous about, press, contact, and galleries pages into one detailed, but simplified page.