Skip to:
Content

BuddyPress.org

Opened 5 years ago

Closed 5 years ago

#5805 closed enhancement (fixed)

Update welcome/credits screen

Reported by: DJPaul Owned by: djpaul
Milestone: 2.1 Priority: high
Severity: normal Version:
Component: Administration Keywords: has-patch
Cc: keepingcozy@…

Description

We need to update the welcome/credits screen for the 2.1 release.

Attachments (12)

patch.diff (1.4 KB) - added by pollyplummer 5 years ago.
First try at creating an animated gif demo of the new mentions interface
mentions-demo.gif (232.8 KB) - added by pollyplummer 5 years ago.
Mentions Demo
mentions-demo-2.gif (197.6 KB) - added by DJPaul 5 years ago.
mentions-demo-optimized.gif (62.0 KB) - added by ubernaut 5 years ago.
mentions-demo-optimized-2.gif (62.0 KB) - added by ubernaut 5 years ago.
welcome-xprofile-uri.png (20.1 KB) - added by mercime 5 years ago.
New Profile Field Type: URL
welcome-translations-2.png (26.2 KB) - added by mercime 5 years ago.
Awesome Translations
welcome-performance2.png (44.3 KB) - added by mercime 5 years ago.
Performance Improvements
welcome-performance.png (62.0 KB) - added by mercime 5 years ago.
Performance Improvements - take 2
mentions-demo.2.gif (171.9 KB) - added by pollyplummer 5 years ago.
Mentions Demo Revised per feedback
Screen Shot 2014-09-12 at 7.43.18 PM.png (180.0 KB) - added by ubernaut 5 years ago.
mentions-demo-reoptimized.gif (63.8 KB) - added by ubernaut 5 years ago.

Download all attachments as: .zip

Change History (60)

#1 @djpaul
5 years ago

In 8774:

Welcome screen: tidy up for 2.1 by removing 2.0-specific media

See #5805

#2 @DJPaul
5 years ago

Also r8775, r8776, r8777. Sorry for forgetting to cross-reference the ticket in the commit message.

#3 @djpaul
5 years ago

In 8778:

Welcome screen: update credits list again

See #5805

#4 @djpaul
5 years ago

In 8779:

Welcome screen: add strings for maintenance/security release notes

These have been copied from WordPress core, which uses them to update
their welcome screen for minor releases without causing string changes
(or tries to).

Since the layout of our welcome screen is not that dissimilar from what
WordPress’, we should see if we are able to make use of these in any
future 2.1.x minor releases.

If we can, this will help our welcome screen be more relevant and
informative.

See #5805

#5 @imath
5 years ago

OOps, sorry, also r8924 is updating credits list

#6 @djpaul
5 years ago

In 8938:

Welcome screen: first pass at the changes text for 2.1.

Once the words are final, we need to go back and add images.

See #5805

#7 @djpaul
5 years ago

In 8940:

Welcome Screen: add missed lines from r8938.

See #5805

This ticket was mentioned in IRC in #buddypress-dev by boonebgorges. View the logs.


5 years ago

#9 @ubernaut
5 years ago

hi let me know if you need anything from me on this

#10 @ubernaut
5 years ago

  • Cc ubernaut@… added

#11 @ubernaut
5 years ago

  • Cc ubernaut@… removed

@pollyplummer
5 years ago

First try at creating an animated gif demo of the new mentions interface

#12 @pollyplummer
5 years ago

  • Cc keepingcozy@… added
  • Keywords has-patch added

This is my first time uploading a patch... it's an animated gif demo for the mentions interface - let me know if there are any problems with it. Here's what the demo looks like:

https://cloudup.com/c0l_zwhoORk

#13 @ubernaut
5 years ago

thats pretty sweet.

#14 @karmatosed
5 years ago

I would be happy as said in IRC to help with this.. but we could do with knowing if the layout is changing or not. @mercime have you any plans on that? Would be great to see any sketches and mockups so we can all help you get this completed.

Looking at what we have if we have 3 screenshots (or more than 1) and they were animated it would be a little overload for users on hitting that page. Maybe we can go the mockup route though and test that?

I'm here to help with whatever needed.

#15 @ubernaut
5 years ago

that gif is only 100k i don't think file size would be an issue there for whatever that's worth.

Last edited 5 years ago by ubernaut (previous) (diff)

#16 follow-up: @mercime
5 years ago

  • Cc mercijavier@… added

@pollyplummer, we have the same idea - animated gif - for the main feature :)

@karmatosed Yes I read the IRC logs, thanks :) We just follow the layout of welcome screen in trunk, it's one animated gif for the new @mention goodness and regular images for the remaining features -> Link to Google document Any/all changes welcome.

#17 in reply to: ↑ 16 @pollyplummer
5 years ago

Replying to mercime:

@pollyplummer, we have the same idea - animated gif - for the main feature :)

@karmatosed Yes I read the IRC logs, thanks :) We just follow the layout of welcome screen in trunk, it's one animated gif for the new @mention goodness and regular images for the remaining features -> Link to Google document Any/all changes welcome.

Thanks for the info @mercime - I didn't realize there was a document already going - sorry bout that. I think that your animated gif is a much better representation in terms of showing multiple users.

#18 @mercime
5 years ago

  • Cc mercijavier@… removed

@pollyplummer sorry, forgot to cc myself on this ticket. Thank you for your contribution, as always. I like the logo in your animated gif :) Please feel free to incorporate the multi-member set up in your gif or submit screenshots of the other sections :)

#19 @karmatosed
5 years ago

I think we need to get this done this weekend ready for the release. Pollyplummer can we please have the animated gif by then. I think in light of this should we not have another animated gif of the feature section, we just use this one. Other sections should either just be text or screenshots.

I'll be working on this on Saturday afternoon so we can make sure we get it in.

#20 @pollyplummer
5 years ago

Ok updated animated gif shows multiple users in the dropdown now. I'm attaching the file, and here's the preview: https://cloudup.com/c8Muh_Ngr2v

@pollyplummer
5 years ago

Mentions Demo

#21 @mercime
5 years ago

@pollyplummer thank you for the updated animated gif :)

@karmatosed as I mentioned above, agreed on the one animated gif :)

#22 @DJPaul
5 years ago

Looks great. I just used imagemin to shrink down the size of the GIF (it's about 30Kb smaller now), and am trying to find out if we can put the image on some website/CDN to save putting a 200Kb image inside the BuddyPress package.

#23 @ubernaut
5 years ago

there were some redundant and glitchy frames in those here is a further optimized and cleaned up version 60k

#24 follow-up: @ubernaut
5 years ago

noticed two small issues with my first upload this one should be good though.

#25 in reply to: ↑ 24 @pollyplummer
5 years ago

Replying to ubernaut:

noticed two small issues with my first upload this one should be good though.

Nice! Love how you edited those extra frames out. I wasn't sure how to do that.

#26 @ubernaut
5 years ago

if you are using photoshop open up the timeline palette select the frame you want and hit the trash icon.

#27 @DJPaul
5 years ago

Impressive stuff; many thanks ubernaut

#28 @ubernaut
5 years ago

always glad to chip in where i can! :)

#29 @mercime
5 years ago

Thanks ubernaut :)

Attached are screenshots for the other features. Other submissions are always welcome.

@mercime
5 years ago

New Profile Field Type: URL

@mercime
5 years ago

Awesome Translations

@mercime
5 years ago

Performance Improvements

#30 @r-a-y
5 years ago

Nice work, everyone!

mercime - One tiny thing, the wp_bp_member_notes table does not exist in BP core. Perhaps you can crop that last row out? :)

#31 @mercime
5 years ago

ooops, sorry about that. Will upload new one @r-a-y :)

@mercime
5 years ago

Performance Improvements - take 2

#32 @mercime
5 years ago

Done :)

#33 @DJPaul
5 years ago

I don't want to rain on anyone's parade, but for most regular users, I don't think that these screenshots are particularly interesting, or easily understandable, or meaningful for the changes they're trying to describe. What does everyone think of only having one image on the page -- the @mentions gif?

#34 follow-up: @DJPaul
5 years ago

@pollyplummer It's taken me an embarrassingly long time to spot this, but where and how exactly did you make your @mentions screenshot? The template looks different from what I see:

https://cloudup.com/cBu_WYsVwPg

#35 in reply to: ↑ 34 @pollyplummer
5 years ago

Replying to DJPaul:

@pollyplummer It's taken me an embarrassingly long time to spot this, but where and how exactly did you make your @mentions screenshot? The template looks different from what I see:

https://cloudup.com/cBu_WYsVwPg

@DJPaul I made it on a dev site using the http://www.cockos.com/licecap/ tool. The site uses a free theme called Eighties.

#36 follow-up: @DJPaul
5 years ago

Thanks. Still looks different when I try. Odd. :) Can you try clearing your browser cache, or let me know what other plugins you have running?

https://cloudup.com/cNl1v9GVC4o

#37 in reply to: ↑ 36 ; follow-up: @pollyplummer
5 years ago

Replying to DJPaul:

Thanks. Still looks different when I try. Odd. :) Can you try clearing your browser cache, or let me know what other plugins you have running?

https://cloudup.com/cNl1v9GVC4o

It may appear different because I had it super magnified to get a better look for the animated gif. I also made some slight adjustments to the button to make it behave better for the recording. Is there something wrong with the gif, do I need to create it again?

#38 in reply to: ↑ 37 @DJPaul
5 years ago

Replying to pollyplummer:

Is there something wrong with the gif

Maybe not wrong, but different. The gravatar's been moved to the other side, and the grey text (which is technically the "display name" on the right is absent).

#39 @pollyplummer
5 years ago

Ah, ok I think the issue might be that none of my fake users I created had display names explicitly set. I just whipped them up with user names and first names.

#40 @djpaul
5 years ago

In 9004:

Welcome screen: remove image TODO notes

See #5805

#41 follow-up: @DJPaul
5 years ago

As good as the current GIF is, it is not representative of the @mentions feature's appearance out of the box. We don't want to tell fibs. :)

The expected appearance of the 2.1 @mentions feature can be seen in the screenshots I've added to this ticket previously, and if you're somehow getting it looking totally different without making any changes, then that's an important bug we need to fix fairly urgently.

I don't have a HiDPI monitor so cannot record a GIF of the appropriate quality. We're getting super close to 2.1 and it would be very awesome if we get the GIF re-made, but if unfortunately it doesn't happen, I'm content to live with shipping 2.1 with no images.

#42 in reply to: ↑ 41 @pollyplummer
5 years ago

Replying to DJPaul:

As good as the current GIF is, it is not representative of the @mentions feature's appearance out of the box. We don't want to tell fibs. :)

The expected appearance of the 2.1 @mentions feature can be seen in the screenshots I've added to this ticket previously, and if you're somehow getting it looking totally different without making any changes, then that's an important bug we need to fix fairly urgently.

I can remake it this evening. That seems to be how it looks for me out of the box if I don't specify display names for each user. But I will try again with display names to see if I can get it working to match your previous screenshot.

#43 @pollyplummer
5 years ago

Hey @DJPaul: After testing with a bunch of themes, it appears that hiding the Display Name is default BuddyPress behavior when the screen is magnified at 125%+ which is what I did to create a bigger animated gif. I actually think it looks nicer without the display name. ;) Also, check out the 2.1 beta on mobile and you'll find that it doesn't show Display Names when doing @mentions there either. I don't think this constitutes a bug and I don't think the original gif misrepresents how BP behaves.

At any rate, I remade the gif for you with screen magnification off so that the display names will show up. I also used a default theme so that it looks more like what you said you were shooting for. I'm attaching the updated one.

@pollyplummer
5 years ago

Mentions Demo Revised per feedback

#44 @ubernaut
5 years ago

a bit late tonight but i can clean that up and optimize tomorrow should i crop out the bottom stuff or leave it in?

#45 @ubernaut
5 years ago

and by bottom stuff i mean everything below this red line:

Last edited 5 years ago by ubernaut (previous) (diff)

#46 @DJPaul
5 years ago

@pollyplummer mentions-demo.2.gif looks great.

I'd forgotten that the feature had mobile stylesheets; you're right that it changes to match your original GIF on smaller devices (or when the font-size is enlarged). :) Sorry that I've made mistakes twice on this ticket now -- big thanks for your persistence with this/me. :)

@ubernaut Sure. I'm not sure what the consequence of doing that will be to the frames after the update is posted, but if you can tweak it to continue to look good, that would be great.

#47 @ubernaut
5 years ago

nothing good happens below that line ;)

#48 @djpaul
5 years ago

  • Owner set to djpaul
  • Resolution set to fixed
  • Status changed from new to closed

In 9010:

Welcome screen: add @mentions demo GIF.

Fixes #5805, big props to pollyplummer, ubernaut, and mercime.

Note: See TracTickets for help on using tickets.