Desolhar
A website about Philosophy

Role

Website creator

Visual Designer
Data Designer

Tool

Adobe 

WIX
 

Duration

Since 2017

It's a new approach

No need for scrolling, you can also just click anywhere 

Overview
From notes to mind maps

Instructions body (2).png

A heavy content

For more than 10 years, I have been reading philosophy books chronologically. Something that I quickly understood was that every book was heavy in content and if not well studied the content was quickly forgotten. 

That is why for the last years I have been working on ways on how to keep track of my notes and what to do with them 

It's a process

 

With that in mind, I created a minimalistic website that has the same appearance as my study desk. The content is divided int 3 categories: notes that help me understand the book, notes that can be re-arrange by topic using all books together, and in the same mix finding critics the philosophers make about each other. This is all arranged in a mind map way.  

 

Understanding
Who am I talking to?

Where am I

It took a while for me to understand that a website I created for personal use was being used in the USA and in the whole world.

Equity is essential

It was not after my website went viral on Reddit that I understood the needs of a user perspective.

Thinking of all the needs

One of my learnings was for example to understand the background color I was using. People with bad vision were having a hard time reading my content. 

Screenshot_2022-08-18_at_19.02.58-removebg-preview.png
Is it better to read this text with this background, 
or with this background that is a bit less bright?
 

Design
Simplisity!

2019

There was no visual concept. The Design was crowded and had a Wikipedia vibe.

2020

Total loss in creative concept. The website became a video game panel, having no cohesion with the content.

2022

Keep it simple and took the layout of my study desk as inspiration to organize the content, having only physical objects as call-to-action buttons.

 

A reflection of my study desk

I used the objects around my desk to be used on the website. The intention was to make the user feel as if it was sitting on my desk reading and studying through my notes.

IMG_2644.WEBP

Web

Desk

 

Brainstorming & Sketching (The content)

For years, I have been working on my notes. On how to present them in a coherent way, how to understand what they are saying and most importantly what does it all mean.

Seneca.png
IMG_0188.JPG
IMG_3599.JPG

NOT CLEAR

 

Medium-Fidelity Design Alternatives (The content)

Many users started contacting me, and slowly I started understanding that when someone new is looking at my notes it was important for them to have a clear beginning where to start reading and a clear reason on what they expect to understand after reading it.

p20wso02kbo81.webp
3kq8mj0g0vt81.webp

Closer...

 

But wait...
Who am I talking to again?

 

Understanding Part 2
Who am I
really talking to?

541293385.027978.jpg

As I mentioned before, this website was first thought of having only me as a user. But other people have started using it. What do they want, and who are they?

 

Hello to you

We already know about their equity necessities and their nationality, but what are they looking for?

8591621b6107ca50a0acf3f5715317da.jpeg

After reading hundreds of comments on my website, I started noticing a tendency:

  • They studied books like me

  • They valued a content that is more thought of that helped them further educate themselves.

  • They read the same books as me and wanted further understandings.

"I really love your concept. On a similar note, I have been reading a lot of self-develooment books recently, and I've been racking my brain on how to keep track of these ideas." BENJAMIN

"I am writing to say that I think that I have skills that can benefit the growth of your site and am willing to help at no cost. I see your work, and work like it, as extremely important in making education more accessible in a time where ignorance seems to be on the rise." BERNARD

"I just saw your website and knew that I had to reach out to you. I've been doing the same as you over the past 2 years, reading and collecting notes, highlighting and compiling then writing short essays to arrive at some kind of conclusion." IAN

 
vurtue better.png

Layout
High-Fidelity Interface & Layout

Close enough

 

1

2

3

2. The most used definition is brought forward with the intention of clarifying the consensus of the philosopher on that specific topic

3. The word that is furthest to the right is the conclusion on the topic

vurtue better.png

The formats

Challenge arranging the layout for the different approaches

1. The Notes are arranged in a chronological order with the intention of showing the development of the topic

By Topic

1

2

1

2. The main points mentioned about this specific philosophers by other philosophers.

Other formats

With the amount of notes, I was also able to build new content with it. 

1. Selected fragments from other philosophers mentioning the philosopher in question.

By Philosopher

1

Other formats

By Book

Screenshot 2022-08-20 at 13.29.40.png

With the amount of notes, I was also able to build new content with it. 

1. Selected of notes organized with an index to bring a Wikipedia style to the page and easy access and overview for my understanding on the book. 

 
 
 

Evaluation
& Feedback 

Finishing all the new formatting, Desolhar was tried out by the undergraduate philosophy class. The feedback was amazingly positive. Desolhar was praised on its visual appearance and interaction.

Usability Metrics

Learnability

Due to the minimal design practiced in the visualization, some users found it hard to understand the content or the conclusion I was trying to provide. I then improved learnability by providing an index to the mind maps, as well as an always-accessible ‘Help’ menu that would bring up a graphic on various controls and descriptions of areas on the screen.

Effectiveness

The design allows users to easily access the content they are seeking for, with relatively few steps.

Insightfulness

The visualization of the topics and Philosophers notes helped users come with the following insights: 

  • Philosophy is a conversation happening throughout centuries of books.

  • A topic has a consensus and a abstraction can be made from the consensus.

  • The best way to understand a philosopher is by the words of another philosopher.

Enjoyment

By using study objects for the design, I was able to make the interaction with the content pleasing, clicking on books or pens to find the content behind it. 

Engagement

By adding new notes every month, the user feels motivated to come back to the website and follow the updates on topics and other pages. Every year I also introduce a new approach to my notes, brining even more excitement to the users.

User Experience 
Metrics

Reflection
For further reference

I am proud of not only how Desolhar turned out to be, but also the process that brought me to were I am now. Unlike any other kind of websites, Desolhar broadened my horizon to the field of information visualization where I got to learn and apply some domain-specific principles.

Goal-Driven Design Process

When designing the multiple interactions, I started out coming up with concepts that turned out to be somewhat meaningless. They might look fancy, but still meaningless. Then I started to ask myself what interaction can really help the user achieve the goals? The reversed process of goal-task-interaction really kept me close to the user and design meaningful interactions.

The Power of Philosophy

I felted so rewarded when users told me they learned something new while using my website, because that was how I felt when I was designing Desolhar. All those hours in the library, all those long nights trying to understand my notes, it all has a meaning at the end.

 
 
 

Let's click away to the next project?