Author Topic: NSF News Site Redesign Update (WORK IN PROGRESS) - September 2017  (Read 10963 times)

Offline Chris Bergin

Here's the latest development screenshots from the ongoing Work In Progress on the news site revamp, led by Mark. The goal is to keep familiarity, but to totally update functionality and appearance.

Feedback is welcomed and encouraged, noting it is still being worked and refined. :)

Desktop screenshots from the development:

Note the article view is an example (thus not a real article) and an actual article will have specific sizing and layout....but as WIP....I know most of you don't like the current version of images in articles ;) Click or open in new window to see it in full view.

Offline Chris Bergin

A screenshot from the mobile news site, still WIP as above.

Offline gongora

  • Global Moderator
  • Senior Member
  • *****
  • Posts: 2124
  • US
  • Liked: 1478
  • Likes Given: 1051
Looks nice overall.  The spacing of stuff in the Active Discussions area seems a bit off.  Are there other sub-sections farther down the page under "SpaceX"?

Offline NSF Webmaster

  • Administrator
  • Full Member
  • *****
  • Posts: 298
  • Almere, The Netherlands
    • NASASpaceFlight.com
  • Liked: 99
  • Likes Given: 10
Looks nice overall.  The spacing of stuff in the Active Discussions area seems a bit off.  Are there other sub-sections farther down the page under "SpaceX"?

The 'Active Discussions' list is still being worked on (alignment,padding) so yes :)

The other content/sections are listed below the SpaceX section but those can rotate depending on the section we want to highlight. The list of 'Latest Articles' as present on the current site is also present below the featured sections


Offline Chris Bergin

Added a fourth slide to the opening post.

Note the article view is an example (thus not a real article) and an actual article will have specific sizing and layout....but as WIP....I know most of you don't like the current version of images in articles ;) Click or open in new window to see it in full view.

Offline pippin

  • Regular
  • Senior Member
  • *****
  • Posts: 2543
  • Liked: 282
  • Likes Given: 39
A screenshot from the mobile news site, still WIP as above.
Would tablet/iPad be a mobile layout or use the desktop layout?

Offline NSF Webmaster

  • Administrator
  • Full Member
  • *****
  • Posts: 298
  • Almere, The Netherlands
    • NASASpaceFlight.com
  • Liked: 99
  • Likes Given: 10
Would tablet/iPad be a mobile layout or use the desktop layout?

tablet friendly :)


Offline pippin

  • Regular
  • Senior Member
  • *****
  • Posts: 2543
  • Liked: 282
  • Likes Given: 39
Niiiice!

Offline Andy DC

  • Full Member
  • **
  • Posts: 239
  • Liked: 22
  • Likes Given: 61
Been a long time coming, but looks cool especially as a working progress! Looks like articles allow for video and various content additions with the text not wrapped around, which is awesome.

Will the forum modify to this format, like the current site does with the header?

Great work!

Offline NSF Webmaster

  • Administrator
  • Full Member
  • *****
  • Posts: 298
  • Almere, The Netherlands
    • NASASpaceFlight.com
  • Liked: 99
  • Likes Given: 10

Will the forum modify to this format, like the current site does with the header?

Great work!


Thanks! Focus is on the news site first, the forum will follow afterwards but yes the forum will also adopt this design/style

Offline RichAM

  • Member
  • Posts: 64
  • Texas
  • Liked: 7
  • Likes Given: 28
Looks really great and clean. I know there will be more things added, but it'll still look bright and clean. I wonder what the other items to add can be, like if there's anything people have seen on other news sites that would be cool to this site? Like I wonder if we could have a next launch in the top bar of the news site, it could be fed off the forum launch calendar?

Articles are going to look so much better with this new site.

Offline KEdward5

  • Full Member
  • ****
  • Posts: 802
  • Dallas, TX
  • Liked: 25
  • Likes Given: 46
Already looking awesome even as work-in-progress! Can imagine some of Nathan's renders as article lead images making it look even more awesome.

Offline Coastal Ron

  • Senior Member
  • *****
  • Posts: 3464
  • I live... along the coast
  • Liked: 2210
  • Likes Given: 2740
Not sure what your goals are with the redesign besides updating the look of the site (which does like more modern) - is anything planned to be done on the SEO side of the house?

For instance, do you plan to use Schema.org tags or other SEO markup systems?
If we don't continuously lower the cost to access space, how are we ever going to afford to expand humanity out into space?

Offline pippin

  • Regular
  • Senior Member
  • *****
  • Posts: 2543
  • Liked: 282
  • Likes Given: 39
The one thing Iím really missing on the current site WRT articles is being able to click images to show them full window/full screen sized.

Offline NSF Webmaster

  • Administrator
  • Full Member
  • *****
  • Posts: 298
  • Almere, The Netherlands
    • NASASpaceFlight.com
  • Liked: 99
  • Likes Given: 10
The one thing Iím really missing on the current site WRT articles is being able to click images to show them full window/full screen sized.

Consider that fixed

Offline NSF Webmaster

  • Administrator
  • Full Member
  • *****
  • Posts: 298
  • Almere, The Netherlands
    • NASASpaceFlight.com
  • Liked: 99
  • Likes Given: 10
Not sure what your goals are with the redesign besides updating the look of the site (which does like more modern) - is anything planned to be done on the SEO side of the house?

For instance, do you plan to use Schema.org tags or other SEO markup systems?

SEO optimalization is definately on the radar, but first we'd like to finalize the design. Thanks for the suggestion !

Offline SteveSpace

  • Member
  • Posts: 75
  • Liked: 16
  • Likes Given: 31
So good! New site, but still feels like NSF. What else are you currently thinking of adding to the news site? Seems like there's plenty of room for more cowbell! ;D

Offline TerryNaylor

  • Full Member
  • *
  • Posts: 178
  • Liked: 6
  • Likes Given: 30
Definitely the cleanest appearance of a site I've seen, knowing there's more to come. I was going to say it's too clean and could use more things, but it's the general design, so that's great.

Also like the idea of a launch alert style clock/counter/widget on the front of site. There's lots of App people on here who can add things, but yeah, not too many things.

Superb work.

Offline incoming

  • Member
  • Posts: 76
  • washington, DC
  • Liked: 48
  • Likes Given: 31
Looks great. 

One of the unique and valuable assets this site has vs other news sites is the healthy and active forums. I've always thought there could be a little better integration between the two, while also maintaining the editorial separation between curated content and community content.

Two suggestions to take or leave -  Having the active topics area helps, and of course it's helpful when articles link to L2 content.  But how hard would it be to have a contextual active topics window when you open an article?  That way, when you open an article and see something you want to discuss, you can see if there are active threads you want to join on the topic already.

Second, and along the same lines, I think it would be good to have a launch calendar that's kept updated by some combination of the mods and the community, again with links to relevant discussion threads.  SpaceX launches are particularly hard to pin down, and it takes a while to dig through the forums to try to figure out what's happening when, what may move, etc.  I think all of the information is here already, it just takes an awfully long time to dig through and find. 


Offline NSF Webmaster

  • Administrator
  • Full Member
  • *****
  • Posts: 298
  • Almere, The Netherlands
    • NASASpaceFlight.com
  • Liked: 99
  • Likes Given: 10
Looks great. 

...


Thanks! And thank you for your suggestions. When the news part of the side is done we'll shift our attention to the forum. As of now, the current forum software is not very equipped to integrate with other systems in a '2017ish way' so we need to take care of that first. More integration between articles and forum discussions (as a concept) is already on the roadmap but the way we are going to make it work is still to be determined .

Mark

Offline haywoodfloyd

  • Veteran
  • Full Member
  • ***
  • Posts: 352
  • Ottawa, Ontario CANADA
  • Liked: 8
  • Likes Given: 1
The News Site update looks much improved.
I would like you to add one more tag or link at the top of the page for Launch Schedule, similar to Spaceflightnow.com.
I have sometimes missed launches because I relied on looking through the Forums to find the latest upcoming launch.
One click of a mouse would be far easier.
I also have some questions and suggestions for the updated Forums but this is the wrong place for that.

Offline cro-magnon gramps

  • Full Member
  • ****
  • Posts: 1471
  • Very Ancient Caveman
  • Ontario, Canada
  • Liked: 637
  • Likes Given: 4637
Will reading old site articles be rendered in new site format, or will they remain old site format... not a requirement either way, just an odd question...
"Hate, it has caused a lot of problems in the world, but it has not solved one yet." Maya Angelou
 Tony Benn: "Hope is the fuel of progress and fear is the prison in which you put yourself."

Offline IdeallyNotOnImpact

  • Member
  • Posts: 3
  • Liked: 0
  • Likes Given: 10
Really like the look! Will it be responsive on phones?

Secondly, I use the web site, not tapatalk. The recent forum posts widget is an iframe and the iPhone does a poor job with caching iframes; most of the time the news section is fresh but the forum topics are stale, requiring a forced refresh in safaris to get the latest. Yes, I think it's an iOS defect, but If there's any way to put recent topics on the news site without an iframe (or have the iframe served differently so that it is cached differently) that would be a great improvement for the more occasional but committed visitor, I mean, me

Offline ClaytonBirchenough

  • Full Member
  • ****
  • Posts: 778
  • ~ 1 AU
    • LinkedIn
  • Liked: 34
  • Likes Given: 343
I like it. Looks cleaner and more modern than the current design definitely.
Clayton Birchenough
Astro. Engineer and Computational Mathematics @ ERAU

Offline Darren_Hensley

  • System Software Engineer, MCTP, NGC, Ft Leavenworth Ks
  • Full Member
  • *
  • Posts: 189
  • Captian(ret) USS Pabilli, Timefleet, UFP-TIC
  • Alamogordo NM
    • H-10-K Enterprises
  • Liked: 10
  • Likes Given: 17
I have designed and implemented 9 web sites, the feed back is basically the same..

Single article pages are the most readable, a navigation bar at top and bottom that are frozen are preferred. HTML Current Page Link at bottom in status bar is required, not optional.
       If you can, use a MLA citation generator button for students convenience.  Call a safe, and validated hidden script and check it often.
An index page with thumbnails is preferred. No sidebars. What's new section OK, Brief, Bulleted.
Make code that will maximize the page width to the browser width, nothing bothers readers more than wasted space, big blue vertical bars to each side of my page in the browser just reeks of waste.
No depth is beyond three clicks from the master article page. Preferably only one click, to a new tab.
A "Back" to master article button is preferred in the NAV bar.
No animation, or update on the fly clickbait. Keeps overhead down, faster load times. Less distractions. Less unwanted content.

If you must use sponsors, absolute bare minimum, static, adverts at the bottom of the page only.
Any page you write is your page, not the sponsors, don't let them alter your vision for a better page by giving preferential treatment to high dollar adverts. Real Readers hate to scroll past cr@p that's in the way to get to the real article.

Make the real article easily recognizable, frame it, font it, whatever, just make distinctive.
Make the page logo short, to maximize the article text area, so the reader can enjoy more. 1/4"-1/2" max@1024
Home link the page logo, everyone does this now, it's a no brainer.
If you must use a "Home" button, put the homepage button at the top right and make it bigger than any other link button, same height as the home page logo, no wider than 1"@1024 res.
No Java, CPP, Pearl or other programming scripts on page, prevents page hijacking.
Minimize cross-article linking to no more than 3, Use notation and Bibliography if more is needed.
No more than 5 tags per page. 3 tags preferred.

Use outline format for articles
"Tell me what you're going to tell me"
"Tell me 1"
"Tell me 2"
"Tell me 3"
"Tell me what you told me"
Lengthy articles should be cut into two articles and so on... Don't lose the reader in a to long to read article. KISS principle applies.

That's what I've gleaned since the days of BBS to modern HTML/JAVA web design.
Do I practice this? No :(, I haven't edited any of my sites in 7+ years, I got my Masters in ITM 2013, I just don't have the time right now, who does?

It's Just My Two Bits(IJMTB) Take it, Leave it, whatever. My Credentials if you really care: http://www.h-10-k.com/h10k/author/author.htm
BSNCM Devry, MAITM Webster, MSSS & MSAP SFA
H-10-K Enterprises Gateway Station

Offline SmallKing

  • Full Member
  • ***
  • Posts: 386
  • Zhejiang, China, the Earth
  • Liked: 164
  • Likes Given: 189
The new theme is nice, but I like the old logo
Some are bound for happiness, some are bound to glory, some are bound to live with less, who can tell your story?

Offline Crispy

  • Member
  • Full Member
  • ****
  • Posts: 564
  • London
  • Liked: 32
  • Likes Given: 6
This is looking fantastic :) A huge improvement.

Make code that will maximize the page width to the browser width

This is not great advice. Line length should be restricted to maintain readability.

https://baymard.com/blog/line-length-readability

On a 21:9 aspect monitor, a "full-width" paragraph might collapse to a single line!
« Last Edit: 09/19/2017 04:33 PM by Crispy »

Offline PahTo

  • Full Member
  • ****
  • Posts: 1498
  • Seattle
  • Liked: 136
  • Likes Given: 418

Lookin' good--keep up the good work!

Offline russianhalo117

  • Senior Member
  • *****
  • Posts: 3865
  • AR USA / Berlin, DE / Moscow, RF
  • Liked: 755
  • Likes Given: 464
The new theme is nice, but I like the old logo
There was a poll and majority voted for a new logo.

Offline moreno7798

WordPress?

Offline russianhalo117

  • Senior Member
  • *****
  • Posts: 3865
  • AR USA / Berlin, DE / Moscow, RF
  • Liked: 755
  • Likes Given: 464
WordPress?
I have written one article for NSF so far and word press I believe is used.

Offline Chris Bergin

Yep. Wordpress. And that answers a previous question about old articles - they will reformat to the new version. Some VERY old articles (which looks a bit messy anyway, as it's from over 10 years ago) were MioManager. We'll look at a potential solution for those, but hardly anyone clicks on 10 year old+ articles.

We also had a logo vote, etc. Never will please everyone, and the current logo is super, but we had to scale down the size of it and move a bit away from "NASA" as we've moved from the initial site of exclusively being about Shuttle to all rockets,etc.

Keep the feedback coming! We'll get this moving and keep updating status and look to utilise the talents of the community for the additional cowbell :)

Offline vaporcobra

Looks amazing, Chris & Webmaster! Beautiful work. I might suggest an optional dark theme users can select, if possible. https://arstechnica.com/ is a perfect example of this being successfully implemented.
spaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaace

Offline RocketLadyUM

  • Member
  • Posts: 43
  • U-M
  • Liked: 8
  • Likes Given: 18
Looking excellent. How long till it's live? :)

Offline Roy_H

  • Full Member
  • ****
  • Posts: 719
  • Liked: 184
  • Likes Given: 1177
Nothing new, but just to re-enforce points already made. I am quite comfortable with the existing layout, but new layout looks better.
- clickable pictures (I know already done).
- there is always a thread in the forum about the article, but sometimes difficult to find. A link at the end of the article would satisfy me. The fancier version suggested above is ok too.
- advertising should be static, ok for column on right, no YOU HAVE TO LOOK AT ME! ads.
- agree with link to up-coming launches. I think a link to Salo's latest list
http://forum.nasaspaceflight.com/index.php?topic=8184.1420
would be sufficient and for SpaceX fans, gongora's list
http://forum.nasaspaceflight.com/index.php?topic=43418.0



"If we don't achieve re-usability, I will consider SpaceX to be a failure." - Elon Musk

Offline docmordrid

  • Senior Member
  • *****
  • Posts: 4327
  • Michigan
  • Liked: 1462
  • Likes Given: 1
Looks amazing, Chris & Webmaster! Beautiful work. I might suggest an optional dark theme users can select, if possible.

https://arstechnica.com/ is a perfect example of this being successfully implemented.

I second this, strongly, especially because of its utility for the visually impaired. Also useful would be an all large text setting and care with color choices in dark mode.

Learned this the hard way before having a cataract repair.
« Last Edit: 09/26/2017 06:23 AM by docmordrid »
DM

Offline NSF Webmaster

  • Administrator
  • Full Member
  • *****
  • Posts: 298
  • Almere, The Netherlands
    • NASASpaceFlight.com
  • Liked: 99
  • Likes Given: 10
Looks amazing, Chris & Webmaster! Beautiful work. I might suggest an optional dark theme users can select, if possible.

https://arstechnica.com/ is a perfect example of this being successfully implemented.

No hard promises on when it will be ready (primary design first) but I'll try to make this work (very wip):
« Last Edit: 09/26/2017 12:34 PM by NSF Webmaster »


Offline Darren_Hensley

  • System Software Engineer, MCTP, NGC, Ft Leavenworth Ks
  • Full Member
  • *
  • Posts: 189
  • Captian(ret) USS Pabilli, Timefleet, UFP-TIC
  • Alamogordo NM
    • H-10-K Enterprises
  • Liked: 10
  • Likes Given: 17
This is looking fantastic :) A huge improvement.

Make code that will maximize the page width to the browser width

This is not great advice. Line length should be restricted to maintain readability.

https://baymard.com/blog/line-length-readability

On a 21:9 aspect monitor, a "full-width" paragraph might collapse to a single line!

Great link to a valid argument.

I'm sure there's a happy medium somewhere in here, I and most of my readers hate wasted space. Maybe fixed column widths larger than news print, but still using the bulk of the width of the page I can see, with two or three columns. Again JMTBW.  Keep up the good work Chris.
BSNCM Devry, MAITM Webster, MSSS & MSAP SFA
H-10-K Enterprises Gateway Station

Offline saundby

  • Member
  • Posts: 25
    • Acedev, the Comic--Welcome to the Rocket Factory
  • Liked: 12
  • Likes Given: 1064
I like the new layout, the tablet-friendly layout particularly. My tablet's screen is larger than half the laptops I use to read the site, anyway, and I hate when sites default or force it into a cellphone format.

The clickable pictures and full breaks around them are a welcome change.

A dark format will also be welcome, I hope that works out.

And, as others have mentioned, links into the forums from the articles will be welcome. Once I go to the forums I'm always asking myself if I should expect the article in one place or another. E.g., I never know when to expect something to be in the Live forum vs. the nation's or company's forum. And wandering into the public forums looking for something is always a crapshoot vs the relatively refined conversations in L2. ;)

Offline NSF Webmaster

  • Administrator
  • Full Member
  • *****
  • Posts: 298
  • Almere, The Netherlands
    • NASASpaceFlight.com
  • Liked: 99
  • Likes Given: 10


Great link to a valid argument.

I'm sure there's a happy medium somewhere in here, I and most of my readers hate wasted space. Maybe fixed column widths larger than news print, but still using the bulk of the width of the page I can see, with two or three columns. Again JMTBW.  Keep up the good work Chris.

 Having an average article stretch the full 100% width of my 27 inch monitor is not helping the readability in my opinion. The new design will scale with your browsers width but up until 1200/1300px width for content. That way most people enjoy the content on almost their full browsers width. People width (very) large displays will have empty filler space at the left and right of the content but most people would prefer to read an article like a book instead of watching a tennis match, right ?

Offline the_other_Doug

  • Senior Member
  • *****
  • Posts: 2511
  • Minneapolis, MN
  • Liked: 1542
  • Likes Given: 2739
I would add to the other comments that I would like to see the link to load the full website a lot more obvious and up-top than it has been.  No matter what you do, most mobile devices will try to force you into either the mobile version of the site, or loading Tapatalk, when you access it.  Preferably, I'd like an option to load the full site kept in cookie and maintained from one access to the next, but seeing as how I clear cache/cookies frequently, I would also like a "Want to see the full site, not the mobile version?  Click here!", right at the top, in larger-than-standard text.

Just my two cents... :)
-Doug  (With my shield, not yet upon it)

Offline Chris Bergin

I hear you on that Doug, although when I've been skipping down the road and had to check the forum on my iPotato, and the phone says "I fink you mean tapatalk, right guv?" and I frown, I scroll down and "FULL SITE" is at the bottom.

Recently, I've found the phone has given up forcing tapatalk on me and loads the full site on my phone :)

Offline Chris Bergin

Just did a double subedit where I prepped William's SpaceX article on the current site but also did a version for the new site in the Dev CMS.

Difference is amazing ;D

Wish I could show you, but it's a password protected Dev site. But NSF News site articles look amazing.

Oh and sneak peek....captions. People have always asked for picture captions. ;D

Offline joesmith

  • Member
  • Posts: 9
  • Liked: 7
  • Likes Given: 7
Heartfelt Thanks,,,, for brightening the days of hopefully lost space dreamers. I mean this in a Sober Thankful way!

joesmith

Online Paul_G


Oh and sneak peek....captions. People have always asked for picture captions. ;D

Fantastic news on the captions :)  A suggestion when defining the 'house rules' on captions - make sure the caption calls out what the picture is highlighting - why is the picture there.

Sure, for some pictures it will be self evident, and the sample photo of an F9 launch just needs to call out the mission, and credit the photographer, but for photos that are showing something detailed (a zoomed in shot of a ASDS thruster pod, or a crop of a stage on the McGregor showing a new component), it would really be useful to have a meaningful caption, otherwise I might think I'm looking for 'something wrong with the left phalange'.

Paul

Offline Chris Bergin


Oh and sneak peek....captions. People have always asked for picture captions. ;D

Fantastic news on the captions :)  A suggestion when defining the 'house rules' on captions - make sure the caption calls out what the picture is highlighting - why is the picture there.

Sure, for some pictures it will be self evident, and the sample photo of an F9 launch just needs to call out the mission, and credit the photographer, but for photos that are showing something detailed (a zoomed in shot of a ASDS thruster pod, or a crop of a stage on the McGregor showing a new component), it would really be useful to have a meaningful caption, otherwise I might think I'm looking for 'something wrong with the left phalange'.

Paul

Or a photo of a specific umbilical with a caption of "Don't know what this is? GET OUT, GET OUT NOW. You're not worthy! Photo by NASA)" ;D

Yeah, copy all.

Offline oliversl

  • Member
  • Posts: 2
  • Costa Rica
  • Liked: 3
  • Likes Given: 6
The new design looks good, it works on mobile too. But I wonder if changing the website colors(palette) and the logo will result in corporate image loss? Will you be doing a re-branding campaign?
I ask because I can identify the website easily by the current color palette and the current logo.

The same happened to spaceflightnow, I liked the original website design because I could read more news in the home page and I was use to it. But I will adapt to the new design as I did before (after a few months) ;)

Tags: