Profile Discussion

37 min read

Deviation Actions

Heidi's avatar
By
Published:
445.8K Views1 Collected Privately
Untitled-1 by marioluevanosThe 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.

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.


01

A collection of unique and interesting styles of profile pages that exist today.

:icongriffsnuff: griffsnuff

Entertaining, friendly, informational, branded, fun and unique.

View Profile

:iconloish: loish

A profile that leads with art, sophisticated and elegant.

View Profile

:iconwlop: wlop

Immersive imagery, action-oriented, connected and socially linked.

View Profile

:iconlynnchenart: LynnChenArt

A new deviant who’s learning how the community works, focused on building their gallery.

View Profile

:iconagawaer: Agawaer

Art with a focus on literature, emphasis on readability and type.

View Profile

:iconpicolo-kun: Picolo-kun

Informative, resourceful, announcer.

View Profile

:iconzilla774: zilla774

Dark, thoughtful, thought-provoking art, expressive, surreal.

View Profile

:iconartgerm: Artgerm

A well-established, long-time deviant. Professional, with a focus on art.

View Profile
Question 01

How could the DeviantArt profile serve your needs better?

02

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.


A

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.

B

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.

Question 02

Do you consider how your profile is being viewed on mobile when adding content and widgets to your profile?

03

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.


A

:iconlynnchenart: LynnChenArt

We had fun working with this profile. Lynn made it easy for us with such a fantastic deviation to feature as her art canvas. We’ll discuss the new navigation idea further down the page.

View Profile

B

:iconzilla774: zilla774

zilla774 has been leading up these design ideas for profile and couldn't wait to add his own canvas art. This approach includes a few additional data points by the profile name in the art canvas.

View Profile

C

:icongriffsnuff: griffsnuff

The row of information on the art canvas image with the age, badges and watch button allows for a simpler navigation bar and cleaner UI overall.

View Profile

D

:iconpicolo-kun: Picolo-kun

We’re excited to see what kind of doodle Gabriel will sketch for his art canvas. The overlay on the art canvas allows us to add information to the top of the page which makes for a cleaner page.

View Profile

E

:iconpetemohrbacher: PeteMohrbacher

A taller art canvas image allows for some data points (watchers, views, etc.) to be placed on the canvas art image. We have some nice transition ideas planned for when you scroll up the page.

View Profile

F

:iconartgerm: Artgerm

This example moves the art canvas image above the profile navigation and keeps it free of user information.

View Profile

G

:iconagawaer: Agawaer

An example of a visual art free profile that has a focus on Literature or other written art forms. The art canvas is presented here is a stock option for Deviants who don’t have anything else to use.

View Profile
Question 3.1

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.

Question 3.2

What data points and information are important to present on the profile page?

04

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.

Color Option:

Grey

Color Option:

Dark Grey

Question 04

Would you use the option to select a background color to align with your art canvas image?

05

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.

Profile Navigation

Profile Navigation

The goal of this exploration is to simplify the navigation and develop new ideas for deviants to get support from fans.

Deviations

  • 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.

Posts

  • Journals Your journal posts.

  • Polls Your polls.

  • Status Your status.

Support Me

  • 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.

Question 05

Do you like the simpler way of organizing your profile?

06

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.

Question 06

How else can we improve how galleries work today? Would you use the featured deviation option in each gallery?



Comments2098
Join the community to add your comment. Already a deviant? Log In
ShadaneArts's avatar

I still want it! :cries: