Challenging usability and UX design of online notebook

I love the note taking functionality provided by the lds tools and apps throughout the scriptures, conference, lessons etc. It has changed the way I read and study and I'm very grateful. I feel a bit weird posting this about a tool the church created and provides for free, but I'm disappointed with the current state of the web notebook and scripture, conference, etc integration. It's lacking some key design features and fails to follow established usability guidelines that would make it a really powerful tool. The apps are great, but sometimes having a full screen and a keyboard are essential, especially when preparing lessons. Unfortunately the web interface is so lacking in some areas that it's impossible to use effectively and I frequently settle to using the apps.

There could be a really powerful study tool and the current design shows a glimpse of what it could be. We really need a full window (or similar) online application that permits showing and creating annotations, links, etc alongside the content (conference, scriptures, etc). We also would strongly benefit from a better notes app that followed modern usability guidelines and had features like sorting, support for images & rich text, citations, etc would be amazing. While some of these features would require a lot of work, some of them are simple design changes or other small tweaks that wouldn't require any backend changes.

Sometimes things are easier conveyed in pictures rather than words. I've put together these pair of attached screenshots with some annotations.

To provide some background, these suggestions come from a place of love and respect as well as two decades of experience in product design, software engineering and architecture. I'm happy to provide mockups, ideas, feedback or even contribute code. I just really want an amazing integrated study tool that all members and friends would benefit from.

In browsing the forum more completely I now see that this is a user only forum and not the correct place for this post. Apologies to all. I'm still not clear on where the best place is to submit this feedback though. One feedback link I clicked on was a 404. This was the second link I found and apparently isn't correct either. If anyone could point me in the right direction, I'd appreciate it.

I agree that the online study experience is a little behind the app study experience. This is a good discussion topic.
The best place to get feedback to the developers and priority-setters is using the feedback link at the bottom of LDS.org.

Only feedback link I've seen is on the main site near the bottom and links to this page https://www.lds.org/tools/feedback/

Looks like they are using a responsive design for most of the site(s) with a maximum width on the inner section around 970px. IMO this was pretty standard not too many years ago. You just didn't have many people running that wide of resolution on their monitors. That being said, most larger responsive sites I've created lately use breakpoints 1100px+ because a lot of people have larger monitors and frequently run a 1920 x 1080 or higher res.

The comparison between the mobile apps and the web are useful but there are a lot of variables when designing for different browsers, browser versions, and OS's on the desktop. That certainly doesn't justify neglecting your sites stylesheets for years but may explain why the devs and designers have chosen to stop supporting at a certain size.

Spent a few minutes overriding the Notes page's CSS to use relative widths vs absolute values and came up with this. It shouldn't be "too hard" to give that page a refresh: Now what to do with that extra space...

Here are my overrides. They are just for larger size monitors so I would tweak them for smaller sizes/breakpoints.

There was a related discussion about usability a while back. See LDS.org Responsive Design Oddities. This person created a stylesheet we can use with the Stylish extension. It solves some problems. Looks like you solved some others. For whatever reason, the church doesn't seem interested in fixing this. I'm glad they're doing responsive designs, but I wish the designs responded to those of us with bigger screens Maybe people can work together to fix the CSS for lds.org in a single CSS fix we can use on lds.org. That would be nice, but it's a lot of different pages within lds.org.

There was a note a while back on this forum from one of the church service representatives that the Notebook feature is on the list for revamp, but we know nothing about the timeline. The Notes feature can be incredibly powerful. In a world where technology is often times a distraction from the spiritual, the Notes feature is the complete opposite: it can use technology to facilitate personal revelation and bless the lives of many church members. I wish it was a higher priority. Right now it's only in English and we've learned that all the articles need to be encoded to work with the study tools, so it's not necessarily a trivial undertaking to make it work.

Im glad this is a topic of discussion. I have thousands of tagged passages in my gospel library but reviewing and retrieving and organizing it in any meaningful way is extremely difficult via lds.org. Would love to see some of our development genius focus on this area.