It’s really minimal. This was also before I decided to move voting to the sources rather than the facts. Among other bits of information I included was the tags, where the fact was filed under (aka the category) as well as the number of sources. That’s a lot of information on the main page.
I had a good reason for including that information. The source count would give visitors a good sense of truthfulness as facts with more sources would thus be more truthful. Tags would be a quick way for visitors to see similar facts while the category would let visitors see more facts that share the theme.
At the time, that was the best I could come up with. I still can’t do much better but what I have now is leagues better.
Here you can see the QR codes I referenced in the first post I also created a logo, which I’ll touch on later. Fundamentally, it’s the same design and template as I started with but with tons of changes. The fact bubbles now have a drop shadow which darkens when moused over, the bubble colors alternate as well. It’s a more monotone design.
You’ll also notice that all the information that was present in the first design is now gone. This is because, in the grand scheme of things, stuff like sources and tags are not important. I’m always glad to be proved wrong but when I read facts I rarely want to follow up with similar ones, I just want to read facts regardless of what they are about. As time goes forward, the style and information presented on this page will change.
Now, I think the page with the most growth has been the single fact view.
It’s basically the same thing as the list view. We see the tags, the category but now the sources are listed out. I moved this information out of the bubble on this page because I had a bunch more room to work with. I realized a few things at this point, when the fact text and information text are the same size, it makes the page a bit difficult to read. Information gets mixed in and it all looks so similar.
I ended up increasing the default font by a few sizes while supporting information like tags, category, the date uploaded remained at font size 12. I also created a script that parsed URL’s, so that only the domain was displayed, and clicking the domain takes the visitor to the source page. I did this to prevent really long URLs from being visible. However, I’m not sure how well a long domain name will be handled in this scenario.
In this version I also added and styled the comments. In the photo they’re static and hard coded into the site. But I wanted to get this out of the way. Again we see the bubble design but only with a upper border. The 50x50 green boxes are avatar placeholders but I’m not convinced I really need to include user avatars.
There’s some curious white space, such as to the left of the tags and below the “Login or Register” text next to the comments. When a user is logged in, they’ll see two icons next to the tags, these icons will let them favorite or report the fact. Favoriting a fact is (at this time) the only type of interaction I plan to allow on the list view, cause if a user likes a fact they should be able to like it then and there rather than click the fact and then favorite it.
I really, really hated designing the logo. I’m not great with graphic design or coming up with original designs. One night I started brainstorming, I wanted to incorporate the name of the site into the logo but that’s where I was so confused. How do I visualize someone clicking on information?
Eventually it came to me. The little ‘i’ in the circle is pretty synonymous when it comes to “information.” We see it on maps, hints on websites, etc etc. There’s a dot between Click and FYI. If I make the logo big enough I can turn the period in the URL into the information ‘i’. So, I did. I then decided to make a giant cursor and put the word Click inside. The result… was an abomination.
It was awful. But I’m glad I got it out because it allowed me to visualize things more clearly. I sat on the idea for a short while, browsing the internet and clicking links as is the fundamental action of browsing the internet. Which, is where I eventually got my next idea. Links have an entirely different cursor when the mouse is over them and links are blue by default. If someone is clicking on the information ‘i’ they’d (1) have this dedicated link cursor and (2) the link would be blue.
This looked so much better. The text was uniform in size, the dot was a bit big but it conveyed a message very clearly. I settled on this. I then asked a few friends if they preferred a blue dot or a black one. They liked the black and I agreed. It would be really weird to have the only color of the site be this blue dot in the logo.
I’m hoping to one day hire a real designer to make a proper logo and also help with the site template. But for now, I’m pretty happy. There are still things that need to be done and finished before I can properly entertain the idea of restyling the site. I’ve got to create more templates and finish other area of the site, such as the user profiles.
More on the QR Codes
QR codes are not permament. I’ve included them because I don’t have images to use or share. So, they’re in the fact bubble so it’s easy to get back to the page if a visitor screen shots the page. QR codes will be used but they’ll be embedded onto the images for each fact. Not sure when I’ll get images working, however. I have a general idea of how the fact images will look.
Images will not be hosted on the server. Instead, visitors can upload their own image for the fact. The server will process the upload, attach the relevant infomartion and output the result for them to save it back to their computer. I’ll likely impose size restrictions to keep things consistent and lessen the server load for the process.
The fact text will be directly over the provided image, with the QR code, URL, date created, and average source score attached to the bottom via a generic banner.