Antitheory Mashups

Antitheory Mashups - Sample

Screenshot from a sample mashup

About.

Antitheory Mashups is a mashup creation tool. It allows people who have various social-media accounts to bring them together in one place. You can mash together your Flickr photostream, YouTube channel, WordPress blog, and your Etsy shop all on a single page. You could also mash together the feeds from your friends blogs or include a stream of your favourite podcast. Try it out for yourself in the mashup sandbox. If you want to create your own mashup just head to mashups.antitheorystudio.com and choose “join”.

As this project is still in beta you may experience some problems. Thankfully, refreshing the page is enough to solve any problems you might be having. The app automatically saves all changes you make, which means that you wont lose your work in the event of a crash. At this point there isn’t a formal bug-reporting system, but if you have questions or bugs to report just leave a comment at the bottom of this page.

Getting started.

There isn’t a proper documentation as of yet. Luckily the operation of the site is very simple and tooltips will let you know how to control the editing process.

You can search for feeds that you want to “mash” by using the search box at the bottom of the page. You can enter the URL of videos, blogs, pod-casts, etc. and the app will automatically scan the site for feeds which it can consume and aggregate.

You can also type in search terms like “cute kittens” and the site will connect to Google and display the search results. Underneath each result is a link that says “Search this site for feeds”. You can click that link and it will automatically copy and paste the URL into the search bar.

You can view your previous search results by using the small navigation buttons to the left of the search box.

If the app finds feeds that can be mashed they will pop-up underneath the search box in a scrollable slider. If the feeds are news or blog feeds the news-items or blog-posts will appear in the slider. If the feeds contain photos, videos, Etsy crafts or podcasts they will be represented by an icon which you can click to view the items.

To close the search results slider just click outside the search area. To open it again just click on it. The same goes for any of the gallery sliders you open.

Once you have a feed you want to include in your mashup you can click and hold its icon image to “grab” it. While holding the mouse down you can drag the icon to the sidebar or the main-content area. Now the feed is added to your mashup!

Note: Icons that represent blogs, RSS feeds, or twitter feeds can only be added to the main content area. Icons that represent YouTube videos/channels, podcasts, Flickr photostreams, Etsy shops, etc. can be added to the sidebar.

You can rearrange the order of the icons by dragging them. To delete a feed simply drag its icon to the “blue-hole” in the bottom right corner.

blue-hole

You can log-out by clicking on the “blue-hole”. To log-in again just visit mashups.antitheorystudio.com

If you head back to your mashup’s address when you are not logged-in you will see what it looks like to the public. If you have not added any feeds in the main content area then that area will not be shown on the public site, and the sidebar will be oriented horizontally. See here for an example of a mashup without the main content area.

Renaming feeds, changing icons and changing the background image.

You can rename your mashup and also change the names displayed above the feed icons. Simply click the current name to begin editing it, when you are finished press enter to accept the changes or press escape to revert the name back to what it was before you started editing it.

You can set what image is used as the feed icon by right-clicking an image within that feed and “Use image as icon”. You can also right-click any image and set “Set as site background” to set the background for the whole mashup. If you want the icon to always show the most recent image in the feed, right-click the icon and select “Auto-update icon”.

If you want to use an image from another feed you can click-drag that image onto the current icon and release it.

Further customization (themes and styles).

Currently the customization of the theme and style of the mashups is not available as a feature of the editor. However if you are technically savvy and willing to do a little leg-work, you can make your own themes and see how your mashup looks with them.

The layout, graphics, fonts and colours of the mashup are defined by external CSS and JSON files making it very easy to create new graphic-styles for a mashup. If you look at the HTML source-code of the page that displays the mashup, you’ll notice a URL being passed to Flash called “flashvars.URLTheme”. If you follow this URL you will see the JSON file that controls the layout of the mashup. Inside that file is a link to the CSS file that contains the style information for the text. Flash does not support CSS fully, check out Adobe’s page on the subject to see what you can do with CSS in Flash.

You can pass the URL of your modified theme file to your mashup by appending it as a GET parameter to the mashup URL. For example, if you uploaded your modified theme to yoursite.com/yourtheme.json then just head to this URL to see it working.

http://mashups.antitheorystudio.com/yourmashup?URLTheme=http://www.yoursite.com/yourtheme.json

Notes on theme customization:

  • If your theme file isn’t properly formatted the mashup wont work, but you also wont see any errors at this point. To make sure your theme file is formatted correctly you can validate it on JSONLint.com.
  • You will run into trouble if you change the fonts in the CSS file. Currently the app loads external fonts from our server, which means in theory you can use any exotic font in your mashup. However, in order to do this the font first needs to be embedded in an external Flash file which is loaded by the app. I am looking into a way to automate the process, but for now just stick with the fonts that are in the default CSS file.
  • All the images you specify in the theme file need to be on a server with a crossdomain.xml policy file that allows Flash to read the pixel-data of the images.
  • There could be other issues as well. As I said before, the theme-editing features aren’t fully tested yet.

 

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>