GRC 175 Learning and Discussion Forum

The Website I chose was the SCP Foundation http://www.scp-wiki.net.
of the three it was the most challenging choice but it has been an interesting experience so far.
SCP was also the most well constructed of the three but I wanted to explore some new ideas in design and layout
which might make the the over all experience more interesting. It is largely text based (1000 pages+) and has a really complicated interface
yet manages to remain fairly intuitive in navigation.

My influences in where I wanted to take the design stem from http://dresdenfiles.wikidot.com for an interesting navigation and buttons.
As a main competitor I chose https://www.creepypasta.com for the way they hung the 2nd tier information at the bottom of the page.
I thought this would free up some space on the homepage and leave room for more design elements.

These uploaded inside page first so the order is

1) inside page of design two

2) home page of design two

3) inside page of design one

4) home page of design one

I created the web versions in the same document on a separate art-board so I only had to upload 4 pngs.

These are very rough (40% done?) and nothing here is final but I think I have found some good ideas to work with and have charted an interesting direction to take this project. There is also a lack of consistent design between the home page and inside page elements I am aware of this and it is the number one task that I will pursue in furthering development of the site. Please tear my project apart gently. thank you.

These are really cool and I think both of your concepts convey the website well! The large amount of body copy on your inner pages is a bit overwhelming and could use some paragraph breaks. I think your second layout is my favorite, as it looks cleaner and more like a report/document. You might try lowering the opacity on the logo in the background so it's not as overpowering. Great start so far!

Nice job! The SCP foundation really needs a new site!! I think the first layouts really give the mood of the foundation, the black background brings in the element of mystery. The content page was the most successful for me, the white boxes in the home page are a little bit much in terms of contrast, maybe a dark gray with whit font or something like that. Cool work, ready to look at a new site to get my creepy pasta on!

I like the second design better. It kind of reminds me of a classified file. Good work in making a terrible website look interesting.

the original website looks boring and horrible but formal, and I think you have achieved that.

I'm intrigued by the last design. It seems somehow more official and ominous looking, in a good way.

These are both very interesting! I think I like how the black designs are laid-out but I like the white, it might be easier to read, although for the type of site you are designing, black would work just fine with the overall mood. I like the type and little tape- cardboard details you added, it gives it a similar mood.

The white layout with the file notes is really eye-catching! This is good for the home page, but I agree with the others on this one, the black background has a nice vibe. Almost as if the whole page is more of a play on the censorship bar.

I like the images you chose. The color scheme is good too. Perhaps work with breaking up the text a little? Create smaller blocks of text so it doesn't feel like a time sink for the potential client?

OH NICE! YOU’VE REALLY DONE ONE BETTER ON THE SCP WEBSITE. I LIKE YOUR SKEUOMORPHIC DESIGN ONE (WEBDESIGNSCP1.PNG) MYSELF. YOU’VE DONE A REALLY GOOD JOB OF MAKING IT LOOK LIKE A REAL SCAN OF A 1960S CLASSIFIED DOCUMENT THAT’S BEING READ IN SOME SORT OF MICROFICHE READER. IT’S A GREAT CONCEIT AND LETS YOU HAVE DIRTY WEATHERED PAGES AND A CLEAN NAVIGATION IN A TOP BAR. YOUR TYPE CHOICES ARE SPOT ON, BOTH IN THE DOCUMENT AND IN THE READER PORTION IN YOUR HEADER AND FOOTER. THAT OLD CARDBOARD CARD IS JUST PERFECT. NAVIGATION IS EASY AND I CAN FOLLOW ALL THE PAGE CONTENT QUICKLY AND EASILY DESPITE THE WEATHERING. EVEN THE TRANSPARENT TYPE BOXES THAT IGNORE THE DOCUMENT READER THEMING WORK OKAY. GOOD USE OF MARGIN THROUGHOUT AS WELL. EVEN THE COLORS, OR RELATIVE LACK OF THEM, WORK WELL HERE. YOU MAY WANT TO TAKE THE SKEUOMORPHISM A LITTLE FURTHER AND HAVE THE BLACK BOX TEXT (WHICH IS WORKING WELL, BTW) “PRINTED” ON THE PAPER LIKE YOUR NAVIGATION IS. I THINK INSTEAD OF HAVING THE SCP OBJECT IMAGE BE A FADED, CLIPPED OFF BACKGROUND IMAGE ON YOUR MOBILE INNER PAGE, HAVE IT BE A SMALLER IMAGE AFTER THE TITLE, BUT BEFORE THE ITEM #. THAT WAY WE CAN SEE WHAT THE SCP OBJECT IS EVEN WHEN WE VISIT ON OUR PHONES. MAKE SURE ALL OF YOUR BUTTONS USE THE SAME FONT SIZE. I’D SIZE ‘EM ALL TO THE LONGEST WORD. GOOD WORK!

<engaging human format protocol 100480> ...

Oh nice! You've really done one better on the SCP website.

I like your skeuomorphic design one (webdesignscp1.png) myself. You've done a really good job of making it look like a real scan of a 1960s classified document that's being read in some sort of microfiche reader. It's a great conceit and lets you have dirty weathered pages and a clean navigation in a top bar. Your type choices are spot on, both in the document and in the reader portion in your header and footer. That old cardboard card is just perfect. Navigation is easy and I can follow all the page content quickly and easily despite the weathering. Even the transparent type boxes that ignore the document reader theming work okay. Good use of margin throughout as well. Even the colors, or relative lack of them, work well here.

You may want to take the skeuomorphism a little further and have the black box text (which is working well, BTW) "printed" on the paper like your navigation is. I think instead of having the SCP Object image be a faded, clipped off background image on your mobile inner page, have it be a smaller image after the title, but before the Item #. That way we can see what the SCP Object is even when we visit on our phones. Make sure all of your buttons use the same font size. I'd size 'em all to the longest word.

Good work!