The DeviantArt Timeline entries from the past few months have discussed how we’re focusing on user experience for DeviantArt and ways to make the site more intuitive. In this journal, we'd like to kick off a discussion on another big design-related milestone: to improve the profile experience on the site, mobile web, and mobile apps.
A lot has changed since the last time profiles were redesigned, and we have a number of interesting design challenges and objectives this time around.
At the forefront of our minds is the presentation on mobile Web, alignment with our mobile app, and a new layer of customization so deviants can make the experience feel more distinctive to their own personality and art. The recurring topic that's surfaced during the process is the need for simplicity.
This journal includes concept designs that represent avenues we're exploring. These are works-in-progress and not final.
A collection of unique and interesting styles of profile pages that exist today.
How could the DeviantArt profile serve your needs better?
We have a significant amount of mobile traffic coming to our site every day from various smart-devices. We also have our own mobile app that's seeing a ton of growth. With the momentum towards mobile continuing on the rise, our goal is to ensure your profile will render perfectly at different sizes, establish optimized page performance, and most importantly, keep your deviations looking beautiful.
Your profile is viewed across a variety of screen sizes. A smaller or larger screen will have an impact on how your content is presented.
The transition of a busy desktop page to mobile web will change the order of how the content is presented and how quickly it loads. Many people choose a simpler layout with less content so it works effectively across all screen sizes.
Do you consider how your profile is being viewed on mobile when adding content and widgets to your profile?
So what would an artist from the world’s largest art community do with a personal image on their profile? Is this the moment your personal brand has been waiting for?
There’s a lot happening on our current profile pages: widgets, galleries, and comments. We want to start the profile redesign with a couple of new enhancements that allow you to personalize your page even more.
Below are examples of how we’re integrating a customizable art canvas that you can add with one of your latest deviations, or create a new piece of art that can be easily added.
How would you take advantage of the art canvas, and how often would you change it?
Focus on the canvas art area only - you can see how the canvas art image has scaled down to work on a mobile screen.
This is the same profile screen but at a desktop+ scale. We believe scaling up from a normal desktop size is also something we need to consider. At its largest size (big monitors) we increase the size and lock the placement of the art canvas on the left, and the content to the right scrolls. The art canvas can be filled with your latest deviations or something unique that you create specifically for this.
Some of the examples above presented the profile without a global header bar. The below animation speaks to how we’re thinking of handling it. The result is that your cover art image aligns to the top of the page, and your own personal brand is the dominant art that fans will first see.
What data points and information are important to present on the profile page?
We’re also exploring the idea of allowing people even further personalization options with the ability to select from one of three color options (black, grey and white) for the background color of the page. This feature combined with the canvas art image should allow you to make the page feel unique and distinctive.
Would you use the option to select a background color to align with your art canvas image?
You’ve seen a couple of different approaches to the navigation design in profile. This is an important topic when considering mobile web, because it not only needs to be intuitive, but also needs to work across different screen sizes.
The goal of this exploration is to simplify the navigation and develop new ideas for deviants to get support from fans.
Galleries Your deviation submissions grouped by gallery name
Favourities All of your favs grouped by collection name.
Work in Progress A place to post your daily sketches (versus finished deviations) with an improved 2-click submit.
Journals Your journal posts.
Polls Your polls.
Status Your status.
Support Highlighting your deviations and activity that need support from the community.
Prints The deviations you have for sale as a print.
Commissions When you create a commission (via widget) for your fans to buy.
Donate Points, Give Premium Membership Other ways the community can support you.
Do you like the simpler way of organizing your profile?
The most important section in a deviants profile is the gallery, and we’ve been looking at ways to improve the experience.
Below is a new style of navigation, the new thumbnail grid that we presented recently, and a different way to navigate to a specific gallery. We’re also looking at ways to include a featured deviation (the large deviation) at the top of the page.
An idea we’ve been working through is to find a way to keep users in your gallery and navigating through deviations. Presented here is an overlay that’s launched when a user clicks on a thumbnail. You can still click through to a deviation page from here.