As part of the v2.0 release cycle, I’ve been working on a macOS/UIKit inspired code theme. In this post, I’m sharing what I have come up with so far inviting feedback and suggestions for changes.
The colours are platform specific, so they will be slightly different across iOS/iPadOS, macOS and the Web. Work on the web part is pending but it’ll look mostly similar to the macOS screenshots.
On macOS, the colours will respect platform specific accessibility features like enhanced contrast, and light & dark modes.
All colours are taken directly from the system provided semantic colours with some alpha tweaks in places where it makes sense.
The story is similar on iOS just like macOS. System provided semantic colours are used throughout.
Across the board, I quite like how this is rendering. It’s softer on the eyes too, and if you didn’t notice, the code blocks no longer use the Menlo typeface at a static 16pt. It’ll now scale dynamically to your font-preference, system sizing or custom, using the SF Monospaced typeface from Apple.
In a future update, I’ll look into embedding additional Monospaced fonts suited for viewing code (my current favourite being Fira Code).
I’ll share additional screenshots on Twitter as I go along tweaking and optimising the code.
So let’s get into the technical details of this for those of your interested.
Here is an excerpt of what the original css structure looked like.
This is from the light theme of my CodeParser. This CSS file is imported by the Class, parsed and processed to convert those hex values into their respective UIColor counterparts and then used in Attributed Strings.
So to make this existing system use semantic system colours included making some trivial changes to my code base, starting with the CSS file which now looks like this:
I’m now directly using the semantic colour names, prepending it with an asterisk to denote a semantic color name, and followed by a pound with the alpha component.
As you can imagine, parsing the above is pretty trivial, so is detecting if it should use the semantic name using -[UIColor performSelector] or the method from my HEX to UIColor category.
Once all of this is wired up, the information is assigned to ranges in the Attributed String the same way as it did before with no changes to that part of the code.
With this new system in place, I can use any of the semantic colours exposed by the host OS, of pure hex values or a combination of both in the same file which makes this solution very versatile and light weight.
Elytra for web is now in public beta and in this post I’ll document some features and quirks of the webapp. You can start using it right away.
When I set out to build the Web App, I wanted to bring as much functionality of the iOS App as possible, and this proved to the tricky. Since version 1 of the app, the Article Reader never used HTML to render the contents. Everything was drawn native to bring native accessiblity functions and remove privacy-sucking scripts from the entire reading experience.
To do the same on the web with the same data was a tad bit challenging, but not impossible.
Some features are notably missing at the moment like:
Viewing and reading your bookmarks
to name a few. I’ll be adding these over the next couple of days and I hope to align the final release of the Web App along with v1.8 of the iOS App.
Just like the iOS App, you can also view your Youtube feeds in the Web App. This has become the de-facto way of me and some hard critics of Elytra to consume the latest content from their favourite Youtube Creators.
Microblog Feeds also get first-class treatment on the Web App just like the iOS App. I am a supporter of what Micro.blog stands for and try to actively use it as time permits. My main website is basically a hosted Micro.blog.
I am really exicted to talk about this feature. I’ve always wanted to listen to podcats in Elytra on iOS but I believe it deserves its own separate app so it does not come in the way of reading content. But things are different on the web. Browsers can host multiple tabs for the same domain. So now on the web, you can open any article in it’s own tab and continue reading another article in the main window. I personally use this to play a podcast in the background while I work or read other articles. I’d love to hear from you how you use this feature.
As some of you may have noticed, I have used the New York font in one of the screenshots. If you have the font installed on your macOS systems, you will be able to use in the App as well. The app does not host the font itself because of its License, but can use it if you have it installed.
We now also have a Slack Group for discussions around the iOS and iOS app and soon the macOS App as well. I’d love to see you there and join in on the discussion.
It’s been a tremendous journey for Elytra since its inception back in 2016 and it’s public launch in 2018. As an Indie Developer, I’d really appreciate it if you shared this post with your friends who may be looking for an RSS Feed Reader on the web. As this is a public beta, everybody is welcome. And as always, you can send support queries to email@example.com or DM me on Twitter. Happy Reading.
Winter is coming… soon. The Elytra Winter 2019 update is already here though. If you feel generous and have a couple of minutes, please leave a review on the App Store. It makes a huge difference for me. Thank you in advance. Here’s the change log:
Added a new Bookmarks Manager. This is much more efficient system compared to the previous system and is much more scalable. This is a non-UI update so you’ll see a lot of performance benefits from this.
Sign in With Apple. If you’re new to Elytra, you don’t need to take any additional steps. If you’ve been using Elytra and are updating to the latest version, please head over to Settings > Account and link your account from there.
Image Viewer: Tap on an image in an article to open it in a full screen image viewer. All images from the article are gathered in single place for easier viewing.
Push Settings: View a list of publishers you’ve subscribed to receive push notifications from.
Added Settings Sync to work in tandem with the web app. More on this soon.
Adding a new feed from the search interface now increments the unread count.
Removing a feed now decrements the unread count.
Recommendations interface now correctly shows the custom Feed name if one is set.
Improves how the app handles & reacts to memory pressure warnings from the OS.
The Author Interface now shows the author’s name prominently and defers the blog’s name to the subtitle.
Drastically improved managing of unread counts in the app.
Improved behaviour of the app when marking backdated articles as read.
Fixes push notifications opening the wrong feed.
Fixes push notifications not opening the article on iOS 13.
Fixed a bug where the app would re-sync all bookmarks even if they existed locally.
Fixed the Settings icon for the Push Notifications row not showing up on some devices.
Fixed the activity indicator persisting on screen when only one or no page exists for unread items.
Fixed a potential crash when opening new feed interface.
Fixes loading of unsupported image formats. Loading an SVG image would cause the app to crash.
Fixed last updated date not matching the actual refresh date when manually refreshing through the User Interface. This only updated when fetching via background refresh.
Fixed an issue that would cause a corrupted navigation bar in iOS 13.
Fixes a crash which could occur when the Trial Interface was presented.
Fixed linked images which would not render if they were contained inside an anchor blog with multiple other elements. These other elements were usually line-breaks preventing the entire block from rendering properly. Affected blog: Saturday Morning Breakfast Cereal..
Removed webp support.
Images are loaded using the same extension from the proxy as the source image.
Fixed a small bug with the unread count when marking read automatically from the article reader.
Fixed an issue with image loading preferences. “Never Load Images” now works properly in the Articles List & Article Viewer.
Fixed some really nasty memory leaks.
Fixed a crash that would occur when launching the app. This was a regression introduced in Build 275 of Elytra and OS 13.1.2.
Micro.blog posts with images now show the image as a thumbnail in the articles list when settings are enabled for it.
Fixed the colour of the summary label (iOS 13 only, correct on iOS 12).
I have been discussing with a few developers across platforms to open Elytra’s API to them so they can also build apps on top of it. I hope this takes off because that’ll mean more and more apps will be using a more private and secure way to read their favourite RSS Feeds.
Other than that, I have made some significant changes to the API and RSS Feed Poller in this update. Here’s a quick change log of things which affects us as Elytra’s Users:
The RSS Feed Poller now fetches more frequently and now fully complies with all HTTP caching mechanisms. Previously I only used ETags to know if a feed document was fresh or stale. But this sometimes resulted in unnecessary requests. If a Feed now tells that the content is to be considered fresh for a day, that will be respected.
Improved the WebSub protocol support. If you write on your own blog, I urge that you check if whatever engine runs your blog supports WebSub. If you’re using WordPress, there are plugins with enable this feature. It’s simple to setup and you get free real-time notifications for your readers.
Thank you for your continued support and feedback and criticism. I will continue to work on the iOS and Web apps through November. I’ll be unavailable on email in December but please feel free to get in touch, I’ll try to reply to you during that time whenever possible. Happy holidays.
This is most likely the last build of Elytra which will be going out to the Public Beta testers. It mostly contains a few minor fixes and two new additions. Read on to learn more.
Long tapping on the All Read button (Double checkmark) in a Feed’s interface will enable you to mark all unread articles as read, including articles not currently loaded in the interface. This is especially useful when you add a new high frequency feed to your list.
You can now optionally use a Dark Application Icon for Elytra. A new Miscellaneous section has been added under settings.
Tweaked the Application Icons to render correctly on displays which use the sRGB colour profile.
Updated the footer text in the Subscriptions Interface to be compliant with Apple’s requirements. This is critically useful for you as well as I have come to realise. (I’m secretly hoping Elytra passes Apple’s review in the first go, as we all do :D)
Fixed application launch on iPads when running Elytra for the first time on the device.
Scrolling to load the next batch of articles now consumes less power. This is done less frequently now by using an alternate system API.
Fixed the status bar being dark (when a dark theme is selected) for the Move Folder interface.
Tapping on the Close button on iPads now deselects the currently selected article.
Elytra Build 110 is now available to all beta testers. This is a sizeable change-log so get ready.
The Publisher title is now included in the Article view. This is very useful when browsing through articles in the Unread or Bookmarked section.
New Subscriptions interface. You’ll see it once during the beta. You won’t be charged for the subscription when you install builds through Testflight.
Off by default, you can now toggle to have Article cover images show up in the Feed interface. To manage this setting, open the App’s settings > Image Handling, scroll right to the end. Articles without cover images will continue to behave as they have always done.
Improves handling of folders when deleting a feed from a folder or deleting the folder itself.
When importing your OPML file, the File Picker Interface will now allow for selection of files saved with the .opml extension as well.
Improved the functioning of the OPML interface for imports and exports.
Improved system for managing unread counts on the Feeds interface.
Code blocks now support dynamic type.
Removed the subscriptions interface from the Introduction interface. The subscriptions interface will now popup once after you add your first feed.
Tapping the search button in the Article’s Interface will dismiss the Search bar if it’s already active.
Fixed a memory consumption issue caused when really long articles are opened.
Fixed an issue where the cover image of an article would render twice, once as the cover image and the other as an image inside the post.
Fixed padding of code blocks.
Fixes height of rendered tweets.
Rotating to a new orientation no longer causes a black out in the Article interface.
Fixed a rendering bug for new lines and extraneous spaces in paragraphs.
Fixed handling of push notification taps.
Fixed the width of the search bar (in the Articles interface) on iPads.
When you update the theme on the iPad and if an article is open, the article will refresh to accommodate for this change.
Fixed the appearance of the New Feed and New Folder inputs.
Sometime last week (or perhaps the week before that), I made some minor changes to how RSS feeds are polled. This made the “engine” more efficient by running in period bursts so as to not block your requests from taking priority.
I did however change something: The older variant used a callback system while the newer variant used Promises. I did not have an integration test to check how this change worked with the WebSub mechanism.
Earlier today when I published the Public Beta 3 notes, I was wondering why I did not receive a push notification. Almost 6 hours later I hit my, “ah ha!” moment.
I have patched the issue and now have an integration test for this incase I break it in the future.
If you are subscribed to Push Notifications for the Elytra blog, you should have received one. If you didn’t, you should totally subscribe.
Elytra Build 104 is now available on Testflight and I’ve added another batch 100 testers to the list. If you still haven’t received your invite, this could be the week.
I spent a small part of the weekend fine tuning things on the server side so it can accommodate more feeds and serve more people without needing to be upgraded to a bigger size.
This update includes a lot of visual fixes and some underlying fixes to how Elytra functions.
Haptic feedback has been enabled now that I have had a chance to fine tune things. This was previously available in the private beta but disabled during public beta release.
Opening and closing folders no longer causes the weird jumpy animation.
Micro-blog posts are now handled in a graceful manner with content snippets shown instead of only the Blog’s title and author.
Added a Reset App option under the Settings.app if you need to externally reset the app. If you do this, your account information will be erased from the device. You can still reload the same account by setting up as usual and then swapping the account ID. Please note your account ID if you plan to do this.
Improved the text that is shared when you long tap a linked header to bring up the Share modal.
Handles .ico favicons correctly.
The Recommendations Interface in the previous build (103) stopped showing any feeds. This was a regression and has since been fixed.
Fixed a crash where some images came with empty urls and the app tried to load them.
Various minor improvements to the Onboarding flow.
Fixed a dead-lock situation when you try to add a feed (which provides multiple feed options) that you already have in your list.
There is a known bug when you open the Import/Export OPML interface and later dismiss it. The overlay persists and causes the screen to be dimmed. A restart fixes this issue. I haven’t been able to trace it or reliably reproduce the issue.
The second Public Beta of Elytra is now available on Testflight. I have also sent out the 3rd batch of invites to everyone who signed up.
To clarify how I’m sending out invites:
Every few days, I pick a batch of 100 (in order) and add them to the Testflight Public Beta list. This is allowing me to ensure that the server can handle the load. So far, it’s been smooth sailing.
Also, thank you to everyone who sent me emails reporting bugs and suggestions to improve the app. It’s been of immense help. As always, if you run into any issues when adding new feeds, send me an email with the link and I’ll take a look.
Here is the change-log for the latest build.
Favicons are now less rounded based on feedback where circles are usually reserved for people’s photos & avatars.
Improves Voice over support for long paragraphs by breaking them down into their distinct paragraphs.
Introduced a subtle load-in animation for the Articles interface.
Now when searching in an article, you can press the ENTER key to jump to the next result if one is available and the ESC key to dismiss the search context.
Fixes an issue where tapping on the cancel button in the Subscription Interface would lock up the process. The continue button no longer remains disabled.
Fixed the text errors on the Subscription Interface.
Fixed a crash that would occur if you navigated to Unread, then back and then to Bookmarks in quick succession.
Fixed handling of URLs without the http: prefix.
Fixed a Voice Over issue where it would only read the first sentence and the first word of the second sentence in a Paragraph.
A warm welcome to all the new Public Beta Testers.
Now that the cheesy stuff is out of the way, let’s get to the meat of this release.
Added a “Open in browser” button to the Article interface.
Implemented Accent colour.
Improves the tinting of the refresh control for dark interfaces or after switching the theme.
Improved the kerning for the System font for the Article’s title.
Vastly improved GIF performance and memory consumption thanks to the FLAnimatedImage library.
Fetching an favicon across all the available images (opengraph, apple-touch-icon and the favicon itself) based on weights. Apple-touch-icon is given a higher preference over the favicon now.
When adding a new feed from the app, typing in http/s is now optional.
When a feed has multiple endpoints, the list now uses head truncation so you don’t accidentally add the comments feed.
Fixed adding feeds from the share extension.
Fixed the position of the popover (iPads) for the long tap interaction on feeds and folders.
Added a default handler for the browser scheme when one isn’t selected.
Fixed an issue where all buttons would remain in the disabled state if the cancel button in the Purchase interface was tapped during first run.
Searching within an article should now work as expected. There is a known issue on iPads where the highlight doesn’t align with the characters you’re searching for. Fixed a rare crash that would occur when dismissing the Unread interface while a page was loading.