

Mockup previews of Appleseed 1.0, feedback appreciated. - michaelchisari
http://opensource.appleseedproject.org/preview/

======
samdk
I'm going to be a dissenting voice here and say that these need a lot of work,
because I think that's a lot more useful than saying they look nice. Please
don't take this too negatively, because I'm not trying to tear you down and
say these are terrible or anything--I'm trying to help you make them better.
Mostly the issues are in the details, but there are larger things too. I don't
have a lot of time right now (or any time between now and Tuesday), but if
you'd like more specifics, feel free to send me an email (it's in my profile)
and I'll be happy to get back to you later this week.

There are definitely good reasons to look like Facebook (which I'm pretty sure
is intentional). The most obvious reason is user familiarity: people know how
Facebook works and they're going to be a lot less intimidated if they've seen
something like it before. However, one not-necessarily-obvious downside to
doing this is that people know Facebook and know how it works, and if things
look like they do on Facebook but don't behave the same then they're going to
be confused. That's not necessarily a reason to change the look entirely, but
it definitely is something you need to be aware of if you're going this route
with your design. Another potential issue is that people really don't like
change. (For an example, see your Facebook news feed any time there's a design
change.) If you look similar to Facebook but not as good, you may have issues
getting over people's initial reactions.

There are a lot of little details I could pick out, but I think your biggest
problem right now is with spacing and whitespace. The info page, for example
([http://opensource.appleseedproject.org/preview/images/info.p...](http://opensource.appleseedproject.org/preview/images/info.png))
has way too much whitespace around the actual information. Whitespace can be a
good thing when your content is balanced with it, but right now the whitespace
is dominating the page and it looks very empty, which is not at all the
impression you want to give off.

The other thing I think you can improve on immediately is your use of
gradients and drop shadows. Right now they're too obvious: a little goes a
long way. The design is otherwise very flat and text-based (not a bad thing!),
and so they stand out a ton and look out of place. The combination of the
square tabs and the very large drop shadow is especially jarring. As a first
step, I'd suggest getting rid of all (or almost all: the subtle blue to white
from top to bottom is working pretty well) of them. Focus on getting the
basics of spacing and hierarchy right first, because that's much more
important.

As a final note, the Appleseed logo in the top left is going to cause some
undesirable behavior if left like that. Either the logo is going to be hidden
by the edge of the window or the picture when the browser gets narrower, or
it's going to cause a horizontal scrollbar. Both are bad things.

Hopefully that was at least somewhat helpful and gave you some things to think
about. And like I said above, I'd be happy to give more (and more specific
feedback) later in the week once my thesis is finished.

~~~
bdclimber14
I think web designs can fit into 1 of 3 categories:

\- Designs that immediately make you cringe

\- Designs that make you analyze for areas of improvement

\- Designs that are so elegant you simply admire

I think these mockups fall into the "areas of improvement" category. They
aren't bad by any means, but I immediately saw myself saying "that shade of
blue contrasts with the rest of the color scheme" and "that is an
inappropriate use of whitespace" and "the padding for that navigation looks
unbalanced."

I think with some iterations and a "designers eye for the developer guy" these
could jump to the elegant category. I think you're past the chasm; designs
that make you cringe can't be iterated upon.

------
michaelchisari
I've gotten some criticism that Appleseed's design and user experience was
lacking, so I decided to work on a set of mockups for where I'd like to see
Appleseed go for a 1.0 release. While we're still on version 0.7.9 (publicly),
I usually feel that solid mockups can set good guidelines for building
software for the future.

I would love to hear HN's thoughts on these, I'll be taking criticism to heart
as I break these out into HTML over the next few weeks.

~~~
e1ven
Way to go! Those mockups look amazing- They're clearly Facebook inspired, but
it brings it's own flavor to the party.

Did you make these in Photoshop, or HTML? Did you do these yourself, or have
these made up?

Either way, FANTASTIC work.

~~~
michaelchisari
Thank you very much! There is definitely some Facebook influence, I tried to
take the best from the best, so you'll see some Gmail in there, some
Livejournal, and some Facebook, along with a little bit of others. No MySpace,
though. :)

I did these myself, I'm not a designer instinctively, but I had a vision for
how I saw things working, so I just started hacking away and refining things
until I found something I liked.

And I did them in Photoshop, that's how I usually do web design, since it's
what I'm most comfortable in.

~~~
bdclimber14
I know its a matter of opinion, but I suggest doing these in HTML/CSS. I could
tell these were done in Photoshop. I think HTMl/CSS will let you fine-tune
these to make them very presentable.

~~~
michaelchisari
That's the next step, I always do mockups in Photoshop, then breakouts in
HTML/CSS as the next step.

------
jedsmith
The mockups look great.

Gut reaction is that you are clearly inspired by Facebook, but there's only so
many ways to peel this particular orange. I'd consider a primary color change
as a quick and painless way to distance the two; I think it's the blue that's
keying me to Facebook the most. There's an argument about whether that's fair,
that they psychologically own social blue in my mind, but better to
differentiate (in my mind).

~~~
michaelchisari
_there's only so many ways to peel this particular orange._

It's true, there's certain paradigms that just work, and I played around quite
a bit with more experimental approaches, and I just couldn't see the user flow
working in a way that didn't throw users completely for a loop.

 _I'd consider a color change as a quick and painless way to distance the
two._

With the beauty of Appleseed themes and CSS, I'll probably try and have three
or four variations on this layout for the 1.0 release.

~~~
jdp23
agreed, definitely try to lead with one that has less facebook-y and
diaspora-y colors

~~~
blhack
Is diaspora really at a point where things can be diaspora-y?

~~~
jdp23
Fair enough. But from a positioning perspective, Diaspora's got a lot more
visibility than Appleseed; so it's important for Michael to highlight the
differentiation.

------
sthatipamala
What concerns me is the emphasis on open-source and decentralization on the
front page. They are marketing the features like this is a software product,
which is not how one should market a social network.

If they ever want this to appeal to anyone but alpha-geeks, they should
emphasize how the unique features make the _experience_ on Appleseed better
than it is on Facebook/other networks.

~~~
michaelchisari
This is a common concern, and I understand where it comes from, but I actually
disagree that we should be marketing directly to users

Instead, I think the most important thing is to become the de facto
foundational software for anyone who wants to build a social networking site.

Do you want to set up a social network just for cat owners? How about one for
orchestra students around the world? Or a fan club of the Anime series, Cowboy
Bebop? Then we want you to run Appleseed. It being open source is a huge
benefit for that. And the distributed features are gravy. Or icing. Depending
on your tastes.

Users may not ever know what Appleseed is, and that's fine.

In other words, Appleseed isn't the next big thing, but we want the next big
thing (or things) to be built using Appleseed.

~~~
wmf
If I'm a cat owner and a Cowboy Bebop fan, would I have two profiles? Would I
choose one site to "own" my profile?

In this Ning-like scenario, what's the value of the distributed protocol you
spent so much time on?

~~~
michaelchisari
You would choose which site best represents your identity. Say that's the
Cowboy Bebop site, so your identity becomes wmf@cowboybebop.example.com

You can now login to lolcats.example.org using that identity. So it acts as a
single sign-on.

There are other planned features, like profile linking and cloning so that you
can have multiple identities tied to a single user, but that's how it works
for now.

~~~
wmf
I don't think it's a good idea for a person's identity to be anchored in one
particular community, because people join and leave communities over time. In
a generic system like Facebook, I can cut all ties with high school if I want
to.

~~~
michaelchisari
That's where linking, cloning, and profile forwarding come in.

~~~
wmf
Intriguing, although I couldn't find any docs about those concepts.

~~~
michaelchisari
I'll write something up for Appleseed's wiki when I get a chance, for the most
part they're original concepts that are being worked out within Appleseed. But
basically, they work similarly to what their names imply.

Linking, Cloning: I have two accounts, on a.com, and b.org. When the two are
linked, actions taken on a.com are duplicated on b.org as my b.org identity.
Friends on b.org are not made aware of the existence of my a.com identity.
There are subtle differences between linking and cloning that are still being
worked out.

Profile forwarding: Works just like email forwarding. I leave one site, and
move to another, and at the original site, I leave a forwarding address.

------
SpiralLab
I don't care as much as other people that Facebook === blue.

But, IMO it needs a bit more polish. To a designer's eye, this immediately
screams "programmer-designed". You may want to hire a designer - hand them
these mockups - and let them add a "designers' touch" [more padding, better
typographic alignment, softer contrasts, etc].

That said - this is a big improvement over the previous design. Also, please
don't feel like I am ragging on your work, just a bit of constructive
criticism.

------
neutronicus
Not related to the mockup, but while you're looking at the thread - have you
thought about making appleseed bittorrent-distributed instead of diaspora-
distributed? In other words, no server at all, just a swarm of computers
storing the social graph data, photos, comments etc. between them with some
amount of replication?

~~~
michaelchisari
I actually don't think that's practical, at this time. Diaspora originally
started out with that goal, but quickly moved over to the same server-to-
server approach that Appleseed had been using.

Just adding the required usability to allow single-users to administer a
social networking instance adds a whole ton of complexity to the software. Way
more than something like Bittorrent.

I think it's possible, at some point, but for now, I think a more conservative
server-to-server approach is necessary.

~~~
neutronicus
Any specific roadblocks you'd like to comment on? Pieces of infrastructure
that are still too weak or anything like that?

~~~
michaelchisari
Social spam, prevention and management. Data replication. Peer scaling and
availability.

------
sudonim
I took a quick look through the mocks and my gut tells me it's a little too
ambitious for a first version. Focus on one problem real people have that
other social platforms don't solve well, and do it well. Cloning facebook's
featureset does not a social network make.

~~~
michaelchisari
It's not a first version, I've been developing this for a few years now,
there's around 50 sites running the software, and our beta site has around 600
users.

It's probably still too ambitious, though, but that's why it's fun. :)

------
bdclimber14
There are so many minor design improvements and "don't dos" that I'd love to
share. If you are interested, I'd be up for skyping and rapidly spouting out
all my feedback instead of typing it. Email is in my profile.

------
wmf
I love the polish. It is way too wide, though, and the left third of the
window is wasted in most cases.

------
blhack
Looks really really really really nice. Did you design it, or did you hire
somebody?

A+ Job.

~~~
michaelchisari
Thank you! I designed it myself.

All those years throwing together flyers for my friends punk rock bands paid
off, maybe. :)

------
phlux
I hate the blue. I think the UI is facebook 2.0 completely, and while I think
they are well done - I think they look like a cold corporate site profile and
is one of the things that I have always hated about facebook - the UI is
really not that good. Sure its functional - but you cant argue that its
something revolutionary.

~~~
michaelchisari
_I hate the blue._

Luckily, Appleseed is very flexible, so it's not only possible to change the
colors, but to radically rearrange the layout while maintaining the
functionality.

I expect many sites running Appleseed will hire designers to "brand" their
site in a way that appeals to their users.

 _but you cant argue that its something revolutionary._

I wouldn't, actually. I think social software works best when it's pragmatic
and conservative. The revolution is under the hood with distributed social
networking.

~~~
phlux
BTW - I dont mean to take away from Appleseed or what you're doing - but I
just have a gut reaction against all things facebook. I have never had an
account and never will and I have a very dystopian view of what that service
really is.

See my post here on the subject: <http://news.ycombinator.com/item?id=2429993>

I believe in social networks, their value and need - but the current execution
in the area is clearly leading us down a dark digital path.

I recall when appleseed was first announced, Ill need to look at it again...

