Re: [PD] Editing CSS style, make pd.info better? [WAS: puredata.info site design provocation]
is it possible as well to see a screenshot of some wiki page? or better
to post the css code here as we can apply it locally and browse everywhere.
attached. But it includes only the classes I modified, i.e. it's not the full css style. and it might not be hyperprecise.
- the link to the Belorussian translation looks a bit orphaned, but I
don't know where else it could go
i agree, maybe it should move in the documentation section.
yep, let's do that.
[snip] blocks (News is already on main page only, Recent Changes appear
on
some sub pages but not on each).
That is a very good point ( even if it's not css...), there is no point of having these blocks on every page. We can imagine a news listing and a recent changes listing inside the div content, and make a "about pd" section. ( like http://www.blender.org/ )
definitely.
- if the main page ever gets populated with News et al, it would be
nice to have a cover picture however. Eventually rotating cover pictures, possibly linked. Maybe a crazy idea, but wouldn't it make sense to have a carousel-like thing showing up items from the Exhibition on the main page?
this is very easy with vimeo, but the problem of the" vimeo video group" is that it is not based on the same curation limit as for the exhibition section, people can add their own videos.
agree, see my previous message. I think it's ok to have the vimeo channel and the exhibition page. Anyway, almost nobody post things to the exhibition page, so we should find a way to make it more interesting to post there.
- all i currently see when clicking Community is "check out
DevelopmentWiki". Is this a temporary or very necessary state here?
when you click "development" you mean? This can be normally easily changed but if Iohannes has done that there must be a reason.
other comments:
- I think it should be nice to have a large picture header, maybe
something like max has done for vimeo: https://vimeo.com/groups/puredata it will "keep together" the whole page.
sure, but cannot do it from the css. So I'm waiting to get the css done first.
- I find the main content div not large enough
Ok, I tried to find a balance, actually I'm afraid this is already to wide for a mobile browser. Can someone apply the css class of the body and see what happens on a mobile?
- i find the navigation menu too padded, specially on the left
Can do less padding, I just like wide spacey things... :) what other ppl think?
tanks for your work,
we all really deserve a better looking portal.
yes i have to admit i'm starting to judge the relevancy of a website at least in part with design modernity. was just looking at various open source 3D gaming engines and i could instantly tell the 2003-2007 era from the 2008-2012 era. i still investigated what each site had to offer, but graphic presentation added to the friendliness/accessibility factor. sites like the current Processing site and Openframeworks.cc seem cleaner and easier to both attract users and navigate.
my thoughts on the design:
overall an excellent beginning to a new look! it started me thinking about possible further improvements. so consider this a design brainstorm thingy with NO obligation that anyone has to do what i'm suggesting (especially Marco who started the ball rolling). i don't have any time to do it at the moment (i'm avoiding grading right now) but it certainly gives me ideas, so here we go:
Navigation
i'm not pushing this but it seems like side based navigation is sort of less common on modern websites? the look is pretty modern and clean however. Processing (2 columns) and Ofx (2 or 3 - not sure) both use top navigation which i think draws the eye better. i resisted top nav for a while but i think it relates better to subject matter. bigger more graphic pictures on the front page of various projects i think will attract more attention to the artistic aspects. a better top banner is a MUST.
Exhibition page
should definitely be overhauled with a much more graphic look whenever possible. Marco's Xth-Sense, Billy's Helmholtz ship animation any other graphic demonstrations of PD in action in realtime either audio wise or using video manipulation ala Gem or whatever should be there in plain view, not just a link to someone's website. No idea if Plone can do graphic grid placement of thumbnails for videos but that's what comes to mind. i'm not against a carousel video thing, but i think it's a consideration for future design.
if it's just a patch processing audio, i don't know, maybe some audio examples of the patch via a jquery-type player onscreen? the idea is to get folks interested equally in what PD can do as well as finding out more information about the artist if they are so inclined.
Downloads and Distributions - separate categories
at the moment if i wanted to find out what PD-vanilla or PD-extended was, i'd have to go to the Downloads page. i'm not sure if that's intuitive enough. if i wanted to find out what a distribution was about versus downloading it, i'm not sure if i'd go to Downloads.
so maybe something labeled Distributions? then put PD-vanilla, PD-extended, and something like l2ork there? i see a huge amount of talk on the list from Ivo about his version and some of it's benefits. i think it should be listed there. there should be Download links of course as well.
Such a page might also be called 'About PD', give a brief history/description of how PD itself works and then the other variants listed below with download links?
Objects list
This is probably overly ambitious but existing objects or patches for vanilla, pd-extended and 'unauthorized' contributed extensions would be great to see described possibly in a simple table form grouped by category, or even better, tagged in multiple searchable ways in a database. i ran into a website listing all of the available objects and contributions from around 2011 and actually started to pull everything off and reorganize everything into a database in Filemaker but got too busy to do anything with it. ideally some indication or form that could be updated by each contributor would be useful. i would propose a form that at least highlights the following:
name | object or patch | category tag/s | vanilla or collection name (like cyclone) | description(short) | distributions (extended, l2ork, whatever) | documentation/example of patch | dependencies (which, if any)
this would sort out objects from patches and especially objects/patches that rely on other libraries to be installed to work. if things were organized correctly PDDP might be able to pull its info from this centralized database, which might help cut down on redundant efforts.
allright i gotta get to work, feel free to discuss/elaborate/tear it apart/whatever.
best to all,
scott
When the new, yet-to-be launched, Inkscape website was being developed I remember the team took some inspiration from what this guy said regarding the current Blender website http://www.blenderguru.com/the-big-issues Scroll down to the Marketing section.
On 11 March 2012 23:02, Scott R. Looney scottrlooney@gmail.com wrote:
yes i have to admit i'm starting to judge the relevancy of a website at least in part with design modernity. was just looking at various open source 3D gaming engines and i could instantly tell the 2003-2007 era from the 2008-2012 era. i still investigated what each site had to offer, but graphic presentation added to the friendliness/accessibility factor. sites like the current Processing site and Openframeworks.cc seem cleaner and easier to both attract users and navigate.
my thoughts on the design:
overall an excellent beginning to a new look! it started me thinking about possible further improvements. so consider this a design brainstorm thingy with NO obligation that anyone has to do what i'm suggesting (especially Marco who started the ball rolling). i don't have any time to do it at the moment (i'm avoiding grading right now) but it certainly gives me ideas, so here we go:
Navigation
i'm not pushing this but it seems like side based navigation is sort of less common on modern websites? the look is pretty modern and clean however. Processing (2 columns) and Ofx (2 or 3 - not sure) both use top navigation which i think draws the eye better. i resisted top nav for a while but i think it relates better to subject matter. bigger more graphic pictures on the front page of various projects i think will attract more attention to the artistic aspects. a better top banner is a MUST.
Exhibition page
should definitely be overhauled with a much more graphic look whenever possible. Marco's Xth-Sense, Billy's Helmholtz ship animation any other graphic demonstrations of PD in action in realtime either audio wise or using video manipulation ala Gem or whatever should be there in plain view, not just a link to someone's website. No idea if Plone can do graphic grid placement of thumbnails for videos but that's what comes to mind. i'm not against a carousel video thing, but i think it's a consideration for future design.
if it's just a patch processing audio, i don't know, maybe some audio examples of the patch via a jquery-type player onscreen? the idea is to get folks interested equally in what PD can do as well as finding out more information about the artist if they are so inclined.
Downloads and Distributions - separate categories
at the moment if i wanted to find out what PD-vanilla or PD-extended was, i'd have to go to the Downloads page. i'm not sure if that's intuitive enough. if i wanted to find out what a distribution was about versus downloading it, i'm not sure if i'd go to Downloads.
so maybe something labeled Distributions? then put PD-vanilla, PD-extended, and something like l2ork there? i see a huge amount of talk on the list from Ivo about his version and some of it's benefits. i think it should be listed there. there should be Download links of course as well.
Such a page might also be called 'About PD', give a brief history/description of how PD itself works and then the other variants listed below with download links?
Objects list
This is probably overly ambitious but existing objects or patches for vanilla, pd-extended and 'unauthorized' contributed extensions would be great to see described possibly in a simple table form grouped by category, or even better, tagged in multiple searchable ways in a database. i ran into a website listing all of the available objects and contributions from around 2011 and actually started to pull everything off and reorganize everything into a database in Filemaker but got too busy to do anything with it. ideally some indication or form that could be updated by each contributor would be useful. i would propose a form that at least highlights the following:
name | object or patch | category tag/s | vanilla or collection name (like cyclone) | description(short) | distributions (extended, l2ork, whatever) | documentation/example of patch | dependencies (which, if any)
this would sort out objects from patches and especially objects/patches that rely on other libraries to be installed to work. if things were organized correctly PDDP might be able to pull its info from this centralized database, which might help cut down on redundant efforts.
allright i gotta get to work, feel free to discuss/elaborate/tear it apart/whatever.
best to all,
scott
Pd-list@iem.at mailing list UNSUBSCRIBE and account-management -> http://lists.puredata.info/listinfo/pd-list
On Mar 11, 2012, at 7:02 PM, Scott R. Looney wrote:
yes i have to admit i'm starting to judge the relevancy of a website at least in part with design modernity. was just looking at various open source 3D gaming engines and i could instantly tell the 2003-2007 era from the 2008-2012 era. i still investigated what each site had to offer, but graphic presentation added to the friendliness/accessibility factor. sites like the current Processing site and Openframeworks.cc seem cleaner and easier to both attract users and navigate.
my thoughts on the design:
overall an excellent beginning to a new look! it started me thinking about possible further improvements. so consider this a design brainstorm thingy with NO obligation that anyone has to do what i'm suggesting (especially Marco who started the ball rolling). i don't have any time to do it at the moment (i'm avoiding grading right now) but it certainly gives me ideas, so here we go:
Navigation
i'm not pushing this but it seems like side based navigation is sort of less common on modern websites? the look is pretty modern and clean however. Processing (2 columns) and Ofx (2 or 3 - not sure) both use top navigation which i think draws the eye better. i resisted top nav for a while but i think it relates better to subject matter. bigger more graphic pictures on the front page of various projects i think will attract more attention to the artistic aspects. a better top banner is a MUST.
Exhibition page
should definitely be overhauled with a much more graphic look whenever possible. Marco's Xth-Sense, Billy's Helmholtz ship animation any other graphic demonstrations of PD in action in realtime either audio wise or using video manipulation ala Gem or whatever should be there in plain view, not just a link to someone's website. No idea if Plone can do graphic grid placement of thumbnails for videos but that's what comes to mind. i'm not against a carousel video thing, but i think it's a consideration for future design.
if it's just a patch processing audio, i don't know, maybe some audio examples of the patch via a jquery-type player onscreen? the idea is to get folks interested equally in what PD can do as well as finding out more information about the artist if they are so inclined.
Sounds like good ideas. If you think those projects should be on the exhibition page, you should just add them: http://puredata.info/docs/sitedocs/AddingToTheExhibition
The only rule is that you can't put projects in the exhibition that you had something to do with (no self-promotion).
Downloads and Distributions - separate categories
at the moment if i wanted to find out what PD-vanilla or PD-extended was, i'd have to go to the Downloads page. i'm not sure if that's intuitive enough. if i wanted to find out what a distribution was about versus downloading it, i'm not sure if i'd go to Downloads.
so maybe something labeled Distributions? then put PD-vanilla, PD-extended, and something like l2ork there? i see a huge amount of talk on the list from Ivo about his version and some of it's benefits. i think it should be listed there. there should be Download links of course as well.
Such a page might also be called 'About PD', give a brief history/description of how PD itself works and then the other variants listed below with download links?
One of the download sections is labels "distros". Not good enough?
.hc
Objects list
This is probably overly ambitious but existing objects or patches for vanilla, pd-extended and 'unauthorized' contributed extensions would be great to see described possibly in a simple table form grouped by category, or even better, tagged in multiple searchable ways in a database. i ran into a website listing all of the available objects and contributions from around 2011 and actually started to pull everything off and reorganize everything into a database in Filemaker but got too busy to do anything with it. ideally some indication or form that could be updated by each contributor would be useful. i would propose a form that at least highlights the following:
name | object or patch | category tag/s | vanilla or collection name (like cyclone) | description(short) | distributions (extended, l2ork, whatever) | documentation/example of patch | dependencies (which, if any)
this would sort out objects from patches and especially objects/patches that rely on other libraries to be installed to work. if things were organized correctly PDDP might be able to pull its info from this centralized database, which might help cut down on redundant efforts.
allright i gotta get to work, feel free to discuss/elaborate/tear it apart/whatever.
best to all,
scott _______________________________________________ Pd-list@iem.at mailing list UNSUBSCRIBE and account-management -> http://lists.puredata.info/listinfo/pd-list
"[T]he greatest purveyor of violence in the world today [is] my own government." - Martin Luther King, Jr.
Ok, I'm moving also to the PdWeb,
please anybody interested subscribe there to follow the discussion!!
http://lists.puredata.info/listinfo/pdweb
M
so maybe something labeled Distributions? then put PD-vanilla,
PD-extended, and something like l2ork there? i see a huge amount of talk on the list from Ivo about his version and some of it's benefits. i think it should be listed there. there should be Download links of course as well.
Such a page might also be called 'About PD', give a brief
history/description of how PD itself works and then the other variants listed below with download links?
One of the download sections is labels "distros". Not good enough?
.hc
Objects list
This is probably overly ambitious but existing objects or patches for
vanilla, pd-extended and 'unauthorized' contributed extensions would be great to see described possibly in a simple table form grouped by category, or even better, tagged in multiple searchable ways in a database. i ran into a website listing all of the available objects and contributions from around 2011 and actually started to pull everything off and reorganize everything into a database in Filemaker but got too busy to do anything with it. ideally some indication or form that could be updated by each contributor would be useful. i would propose a form that at least highlights the following:
name | object or patch | category tag/s | vanilla or collection name
(like cyclone) | description(short) | distributions (extended, l2ork, whatever) | documentation/example of patch | dependencies (which, if any)
this would sort out objects from patches and especially objects/patches
that rely on other libraries to be installed to work. if things were organized correctly PDDP might be able to pull its info from this centralized database, which might help cut down on redundant efforts.
allright i gotta get to work, feel free to discuss/elaborate/tear it
apart/whatever.
best to all,
scott _______________________________________________ Pd-list@iem.at mailing list UNSUBSCRIBE and account-management ->
http://lists.puredata.info/listinfo/pd-list
"[T]he greatest purveyor of violence in the world today [is] my own government." - Martin Luther King, Jr.
On Sun, Mar 11, 2012 at 12:37, Marco Donnarumma devel@thesaddj.com wrote:
[...]
- if the main page ever gets populated with News et al, it would be
nice to have a cover picture however. Eventually rotating cover pictures, possibly linked. Maybe a crazy idea, but wouldn't it make sense to have a carousel-like thing showing up items from the Exhibition on the main page?
this is very easy with vimeo, but the problem of the" vimeo video group" is that it is not based on the same curation limit as for the exhibition section, people can add their own videos.
agree, see my previous message. I think it's ok to have the vimeo channel and the exhibition page. Anyway, almost nobody post things to the exhibition page, so we should find a way to make it more interesting to post there.
- all i currently see when clicking Community is "check out
DevelopmentWiki". Is this a temporary or very necessary state here?
when you click "development" you mean? This can be normally easily changed but if Iohannes has done that there must be a reason.
other comments:
- I think it should be nice to have a large picture header, maybe
something like max has done for vimeo: https://vimeo.com/groups/puredata it will "keep together" the whole page.
sure, but cannot do it from the css. So I'm waiting to get the css done first.
I agree with your previous comments/decisions Marco.
About the main page: a large picture picture header is what we are seemingly all talking about. The question is it's content. I reckon it shall not be static, but something that dynamically changes over time. My vision is to have that kind of carousel [1] which would rotate content. Now, the content could be from Vimeo, but I agree it's risky because it's beyond our control. The Exhibition, on the other hand, seems just right, because a carousel doesn't have to have so many elements anyway. Of course it's more than CSS. When it's decided and you think it's time, I can help with putting it together.
[1] some carousel examples: http://www.smileycat.com/design_elements/carousels/
- I find the main content div not large enough
Ok, I tried to find a balance, actually I'm afraid this is already to wide for a mobile browser. Can someone apply the css class of the body and see what happens on a mobile?
I just checked with an iphone emulator (ibbdemo) and i don't even see the new design. No idea why.
- i find the navigation menu too padded, specially on the left
Can do less padding, I just like wide spacey things... :) what other ppl think?
On a large screen it looks fine to me.
a new observation: visited links have their own color (i guess they shall not) which seems to be dark grey at some parts of the page and some pages, and purple on some other pages
tanks for your work,
we all really deserve a better looking portal.
Thanks!
András
-
András Murányi -
Antonio Roberts -
Hans-Christoph Steiner -
Marco Donnarumma -
Scott R. Looney