Facebook Groups

Share what you care about with the people who care about it most. From wireframes to design, I worked on this project for Facebook in order to promote their app Facebook Groups. Here's a part of the design development I created.

-

My first exploration was to create a website around stories of different groups. The idea was to make a layout similar to a lifestyle blog exposing the content of what could be share in the facebook groups application.

design-p1_1

The dots are used to display different stories on a vertical scrolling page. Once you click on getting started, you have a panel sliding in with videos about how to use the product.

design-p1_2_2

Layout Variation

Layout Variation

design-p2_2
1_1
design_exploration4_4
motor1
motor2
motor3
motor4
motor5
motor6

Another idea was to invite the user in a playful interactive website where you were able to slide images or videos of different types of groups till the discovery of the Facebook Groups logotype.

Layout variation

Groups exist when people share common interests. To represent this bond between people, I wanted to explore a mind map design showcasing various groups by dots of different colors around the content.

After all the previous research and experimentations, I tried to keep the best ideas in a simple layout. A header with an image or video of groups of people to bring expose first what the application is about. A second part with a scrollable content view of a group conversation. A third part with the app interface and some informations about how to get started. The last part contain the download links.

site_less_nav_02
A
B

Layout variation

Layout variation

site2

Another idea was to use circles as a way to isolate faces of people on a group of friends then use them as a profile picture in the facebook groups interface.

circle_01
circle_02
circle_03
circle_04
circle_05
circle_06
circle_07
circle_08
circle_09

FINAL

The final website design is using a simple structure, the first part is a carousel with images of groups. The second is a carousel of the main features of the application. The last, the download part.

Group 1
2

© 2019 TAURUS Lionel, All Rights Reserved.