• Ahmed Sulaiman, almost 4 years ago

    Now about my design process:


    1) Content As you can imagine the biggest problem of putting this together was the amount of content we had. 4 years of research turned out to be quite a lot of information to fit into one website. We've tried different approaches and ended up on structuring content with 2 layers navigation.

    There are 8 main topics (like "Free Design Resources" or "Managing community efforts"). For each of these topics, available information is grouped by the tool of interest (Sketch, Figma InVision Studio etc.). So as a first step, the user selects the tool. Once we know the tool we show the sub-categories related to a specific topic (like "Free Design Resources") along with visual examples.

    In the end, the design consisted of 64 separate pages of content + empty states and other utility information.

    2) Visual Style This time I've tried to stand back from the regular website style we use in our other products (like Flawless Feedback or Design Tools Weekly). Instead, I've decided to go with vibrant, high-contrast gradients and dark background.

    It turned out to be rewarding to drop everything I used before and just sit with a pen and paper to come up with something new and fresh.

    3) Branding This part was particularly tricky. The website itself has no standard logo. But still, we had to come up with the proper representation of the project. After numerous variations and tries the main association chain was developed:

    ‣ The project is about community ‣ Community is about people ‣ The community must be grown ‣ Building community means growing it ‣ Trees and leaves could be a representation of growth in nature ‣ The leaf has its own lifetime and growth cycle as well as community ‣ Leaf requires care to be grown as well as community ‣ Care about growth means love ‣ Love represented by the heart ‣ Community is always diverse and should be accessible for anyone to participate ‣ Community is never static and constantly changing

    As a result of such thinking I've come up with the logo, which is: ‣ Tree leaf which has a form of heart ‣ It has vibrant color as a representation of diversity. Leafs could be different, not just green. ‣ The leaf has holes here and there as a representation of the dynamic nature of communities.

    I really hope you enjoy reading the research and hopefully, you can find something useful for building your own community!

    2 points