Here's the deal. I've animated + coded a variety of 'screensavers' in Actionscript3/Flash. They make extensive use of the timeline, AS3 code, the TweenLite library, and embedded fonts. That's the limit of my programming knowledge. I've tried, to no avail, to convert my .SWFs into screensaver files using a variety of software, such as InstantStorm. Somehow it never works, the code never executes properly, it's a disaster.
So, I'm wondering if it's possible to make a screensaver that simply contains an embedded browser, and have it point to my .SWF file, hosted on my web-server. Basically, imagine a full-screen website acting as a screensaver.
If this is possible, what is the EASIEST and FASTEST way for me to whip up a solution for both PCs and Macs? Language, etc. I'm hoping something that has a library I can simply draw from to embed the browser view :)
My startup is developing a product to do exactly this, it's called Screensaver Ninja and you can find it at https://Screensaver.Ninja.
You can set many different web pages with different timers. The configuration tool allows you log in and navigate to the page you want to display:
It uses WebKit, on Mac OS X it uses Safari's and on Windows it uses Chrome's and in both cases it has a separate session from any other browser installed on the computer.
Here's a small Windows-only solution:
https://github.com/cwc/web-page-screensaver/releases
You could modify this open-source one for the Mac so that it's hard-coded to your URL:
http://www.liquidx.net/blog/2010/11/13/webviewscreensaver-for-mac/
Modify hasConfigureSheet() to return NO and change the URL in kScreenSaverDefaultURL. And change the name!
What technologies are used to power Quake Live?
Specifically, how do you create a web application that makes such extensive use of 3D in the browser? The service requires you to download and install a plug-in in order to play. How do you create such a plug-in, and how does it interact with the web site?
Browser programs are very simply, programs. They are given an interface to interact with the browser, but beyond that, they can do anything a normal native application can do, like use DirectX or OpenGL.
Internet Explorer registers plugins using ActiveX. Firefox, Chrome, Safari and most other browsers use Netscape's NSPlugin API.
The MDC has plenty of documentation on writing plugins for Firefox.
There is also a question on SO about writing plugins for IE.
I've created a small activex control, it works fine in IE, surprisingly enough it doesn't seem to work in any other browser. I know that firefox has got an add-on to enable activex, my question is if there is any general API for all browsers to suggest the client to install. Other than that, what options do I have for enabling my activex component on multiple browsers?
ActiveX is a Windows-only, Internet Explorer only API. You can perhaps get an limited support in Firefox but most browsers won't support it. I'd really consider using something else like Flash, Javascript/HTML or even Silverlight which are supported across browsers and platforms.
ActiveX is still actively developed by Microsoft but has been commonly used for virus/malware delivery so users are (rightfully) very suspicious of applications written using it.
How can i start the development of a site that can be browse from mobile phones? For example, if you browse Gmail site from an iPhone the site looks different from the normal site. You have to design two differents sites to do this? How can I know if the site is accessed by a mobile browser?
You don't HAVE to design two different sites, but you probably want to if it's important to let mobile users access your site.
There are a few ways to deal with this problem, each with pros and cons. I'm assuming that your site has its information in a database, and publishes that data using a set of templates? (Like a Ruby on Rails or Django site; a PHP site; a blog; etc.) If you've hand-coded a bunch of static HTML pages, this is going to be way more labor intensive for you.
1: Same HTML, different stylesheets for SCREEN and MOBILE
The idea: You deliver the same HTML structure to all requests. You create a stylesheet for SCREEN and one for MOBILE.
Good: For you, the programmer. It's easier for you to maintain 2 stylesheets than it is to maintain 2 totally separate template sites.
Bad: For your users. A site that's easy to use on a mobile device usually is inefficient for a normal browser; and sites optimized for a desktop / laptop often fail miserably on a mobile device. Obviously it depends on how you code your pages, but in most cases, pushing your normal site to a mobile browser will be bad for your users. (See http://www.useit.com/alertbox/mobile-usability.html for a summary of Jakob Nielsen's recent usability research on mobile sites.)
2: Maintain separate sites
(Gmail maintains even more than 2 systems! They basically have different container applications / templates that process the same data: the full AJAX browser version; the plain HTML browser version; a basic mobile version; a native Blackberry application; and a native iPhone application.)
This is the emerging standard for sites that really care about having both a mobile and desktop presence. It's more work for you, but in general it's much better for your users.
On the upside, you can probably create one stripped down pure HTML site that works for mobile and that acts as a fallback for the rare web user who doesn't have javascript, or who has major accessibility issues that prevent them from using the "full" site.
Also, depending on your user base: in the US, people generally have access to a desktop / laptop, and use their mobile devices for auxiliary access. For example, I book my plane tickets and rental car using my desktop computer, but I want to look up my reservation code on my mobile. In many cases, you can get away with limiting the functionality that you offer on the mobile site, and require the full computer to perform uncommon use cases.
The basic procedure:
Design & build UIs for mobile and screen.
Launch the sites at two different URLs; the emerging convention is www.yoursite.com for the desktop version, and m.yoursite.com for the mobile version. (This allows users to browse directly to m.yoursite.com if they know of the convention.)
On www.yoursite.com, sniff the user agent and test to see if the user's browser is mobile. If so, direct the user to m.yoursite.com.
There are sniffers written in various server languages (PHP, Perl, whatever) that you can probably use. Check the licenses. Here's an example of a sniffer written in php.
From Wikipedia's article on user agent sniffing: "Websites specifically targeted towards mobile phones, like NTT DoCoMo's I-Mode or Vodafone's Vodafone Live! portals, often rely heavily on user agent sniffing, since mobile browsers often differ greatly from each other. Many developments in mobile browsing have been made in the last few years, while many older phones that do not possess these new technologies are still heavily used. Therefore, mobile webportals will often generate completely different markup code depending on the mobile phone used to browse them. These differences can be small (e.g. resizing of certain images to fit smaller screens), or quite extensive (e.g. rendering of the page in WML instead of XHTML)."
On m.yoursite.com, provide a link back to www.yoursite.com. Users who click on this link should NOT be redirected back to the mobile site, and how you accomplish this depends on your implementation.
You may want to follow Quirksmode for his emerging articles about mobile testing.
3: Templates output different data chunks depending on the user-agent, and maintain separate stylesheets
Like (2), this requires you to sniff the user agent. Unlike (2), you're still using all the same page logic and don't have to maintain two separate sites. This might be okay if you're just dealing with a blog or website that's mostly about reading data.
In your template code, you can say things like
if( $useragentType != mobile ) {
echo( 'bigBlockOfRelatedArticlesAndAds.php' );
}
This lets you mostly maintain one set of template files. You can also streamline the pages that you're sending to your mobile users, so they don't get a big bloated page when they just wanted to read your blog post or whatever.
The majority of mobile devices these days support "mobile stylesheets" which are simply alternate stylesheets to display things simpler. You can add a mobile stylesheet to your site in the normal way and include the media="handheld" attribute:
<link rel="stylesheet" type="text/css" href="/mobile.css" media="handheld" />
Then those styles will apply to mobiles.
The only problem with this method is if your HTML is bulky, it may take a while for the page to load since most mobile browsers are slower (except Opera Mini). That's why the bigger sites like flickr and digg use separate sites.
Additional notes:
Bulky HTML doesn't affect Opera Mini as much because it uses a proxy which does the rendering externally then sends a special "image" to the device.
Use simple, clean HTML then you can send the same to normal browsers and mobile devices
You'll have to check on the combinations of stylesheets with media attributes. IIRC adding the code above will make browsers ignore the first stylesheet. If you add media="all" to the first one, both will be used (and you can thus override the original styles rather than start afresh).
For checking how a weppage looks in a mobile Browser use Opera Mini Emulator
Check out the WURFL project. Its intention is to help developers target multiple phone browsers, and started way back before there was Mobile Safari, back in the days of HDML, WAP and XHTML-MP. It's up-to-date however, storing capabilities of modern devices such as iPhone. It has data on over 400 devices, and has libraries in Java, PHP, Perl, Ruby, Python, .NET, C++. Depending on how broad you want to target your mobile app it's something to look at. Here's a list of sites that use WURFL.
Another related project written by Luca Passani (the co-founder and maintainer of WURFL) is Switcher. You can use this to automatically redirect to the mobile version of your site.
Keep it simple, think opera mini and you will get it right.
(iPhone has more off a normal browser...)
Focus on content
Avoid plugins
Follow the web standards
Separate content from layout/design, use css as much as posible.
Use text and pictures.
Add the rest of the bells and whistles if you must, but make sure the the site:s content is always available even when the bells and whistles are turned off.
If you can browse the page with a simple browser like lynx and normal browser like firefox then you are on the right track.
For more info feel free to visit the any browser campaign
Edit: In case it is not obvious you work with different css for different types of browsers, but always use the same content.
Visit the css zen garden for a nice demo.
Update:
Adding a link to css media types, and as stated by others it is the handheld option that is interesting.
http://www.w3.org/TR/CSS21/media.html
You have to design two differents sites to do this?
Yes
How can I know if the site is accessed by a mobile browser?
Your programming language has probably some way of looking through the client's information. PHP, for example, has a superglobal variable $_SERVER that has all kinds of information of both the serving server, and the visiting client. In this case, you would be interested in the value of $_SERVER['HTTP_USER_AGENT'], which would give the following result, should I visit a page:
Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10_5_6; en-us) AppleWebKit/528.16 (KHTML, like Gecko) Version/4.0 Safari/528.16
This tells you that I'm running Mac OS X 10.5.6, using Safari 4.0. There are known keywords for various mobile browsers. One version of iPhone's browser, for example, has the following user agent:
Mozilla/5.0 (iPhone; U; CPU like Mac OS X; en) AppleWebKit/420+ (KHTML, like Gecko) Version/3.0 Mobile/1A543a Safari/419.3
the "iPhone" already gives it away, but is further confirmed by the keywords "Mobile" and "Safari"
Most sites have a slightly different sub domain for mobile sites (most use "m"). e.g. flickr uses m.flickr.com
(there is a recommendation to use the .mobi TLD but I've never seen that used)
Make the design super simple, don't use too many graphics, where you need to keep them as small as possible.
This might be helpful for the design.
I would probably construct a different set of pages for mobile users, making use of the same business objects etc. as you're using for the main site.
If the differences between the design of the two sights isn't to great you might be able to get a way with just serving separate CSS files?
Your site should limiited to the mobile phone which can support on maximum requirements. you can not even entertain all the mobile phone.
Your web site should have different set of css style, and HTTP AGENT must check the client type according to the request Css selection should take place .
I've been utlising a "web browser control" in desktop based applications (in my case Windows Forms .NET) for a number of years. I mostly use it to create a familiar flow-based user interface that also allows a seamless transition to the internet where required.
I'm really tired of the IE browser control because of the poor quality html it generates on output. Also, I guess that it is really just IE7 behind the scenes and so has many of that browser "issues". Despite this, it is quite a powerful control and provides rich interaction with your desktop app.
So, what other alternatives to the IE browser control are there? I looked at a Mosaic equivalent a year ago but was disappointed with the number of unimplemented features, maybe this has improved recently?
hmm..Interestingly
Mozilla seems to provide ActiveX control
K-Melon is another Gecko based browser control
Popular layout engines:
Mozilla Gecko
KHTML
WebKit (based on KHTML)
Though I'm not sure how easy it is to embed those in a .Net app.