W dniu wczorajszym Microsoft ogłosił wydanie drugiego Platform Preview najnowszej wersji Internet Explorera 10. Muszę przyznać, iż wprowadzone funkcjonalności robią wrażenie, ponieważ wreszcie wszystkie popularne przeglądarki będą obsługiwały nowoczesne standardy. Z nowości jakie zostały dodane do IE10, najciekawsze wydają się być:
Pełna lista wprowadzonych zmian znajduje się pod adresem http://msdn.microsoft.com/en-us/ie/gg192966.aspx.
Microsoft przygotował również wideo prezentujące kilka najciekawszych zmian.
Nie mogę się doczekać czasu, gdy stwierdzenie “działa we wszystkich nowoczesnych przeglądarkach”, będzie również dotyczyło IE.
Jednym z pierwszych etapów tworzenia aplikacji, jest przygotowanie jej prototypu. Dzięki temu już w początkowej fazie projektu unikniemy nieporozumień “miałem coś innego na myśli” lub “myślałem, że będzie to wyglądać/działać inaczej”. Kolejną zaletą prototypowania jest możliwość przekazania grafikowi wstępnych założeń dotyczących układu poszczególnych elementów w aplikacji i oszczędzenie ogromu czasu na wyjaśnianiu naszej wizji.
Narzędzi do prototypowania znajdziemy wiele z najpopularniejszym na czele Axure. Ponieważ cena Axure’a nie zachęca domowego developera do wydania niemałej gotówki na licencję, warto sprawdzić co oferuje konkurencja.
Ostatnim narzędziem do prototypowania z jakim się spotkałem, jest tytułowy MockFlow. Jest to flashowa aplikacja dostępna przez przeglądarkę z desktopowym klientem stworzonym w technologii Adobe AIR. Co ciekawe, autorzy projektu udostępnili również klienta mobilnego pozwalającego na dostęp do stworzonych prototypów z urządzeń mobilnych obsługujących HTML5.
Wspomniałem przed chwilą, iż dostęp do prototypów można uzyskać z mobilnych urządzeń. Dobrze się domyślacie – MockFlow działa jako typowa aplikacja internetowa, przechowująca dane online, do których dostęp uzyskuje się przy pomocy wspomnianych klientów. Klient desktopowy ma możliwość pracy w trybie offline, więc w przypadku braku dostępu do sieci, nadal można korzystać z aplikacji.
Co potrafi MockFlow? Całkiem sporo. Przede wszystkim pozwala stworzyć w miarę interaktywny prototyp aplikacji pozwalający na dokładne przygotowanie szkicu aplikacji. Spośród kilkudziesięciu dostępnych elementów znajdziemy przyciski, zakładki, wykresy, captcha, kalendarz i wiele innych. Jeśli okaże się, iż w dostępnych elementach nie ma przez nas wymaganego, możemy odwiedzić MockStore. Znajdziemy w nim dużo gotowych elementów przygotowanych przez użytkowników aplikacji. Gotowy prototyp możemy wyeksportować do pliku PDF, PPT, podejrzeć online oraz pobrać w postaci projektu HTML5. Możemy również wygenerować specyfikację w postaci dokumentu Word.
Bardzo interesująco przedstawia się wbudowany system kontroli wersji, pozwalający na przeglądanie zmian wprowadzonych do prototypu wraz z komentarzami dodanymi podczas zapisywania kolejnej wersji. Na uwagę zasługuje również możliwość zaproszenia innych osób do pracy nad prototypem oraz wbudowany chat, dzięki któremu będziemy mogli się z tymi osobami komunikować.
MockFlow udostępniony jest w dwóch wersjach. Pierwsza – darmowa – pozwala na utworzenie jednego projektu składającego się maksymalnie z czterech stron. Ponadto nad projektem mogą pracować tylko dwie osoby, a ilość rewizji w historii ograniczona jest do pięciu. W wersji płatnej wszystkie ograniczenia są zdjęte, a limit miejsca na serwerze do przechowywania danych rośnie z 10MB to 5GB. Wersja płatna kosztuje 69 dolarów na rok.
Strona projektu – www.mockflow.com
Ostatnio rozwiązania „chmurowe” przeżywają rozkwit, a tylko czas pokaże, czy cała chmura, to tylko chwilowa moda, kolejny buzzword, czy jednak nowy kierunek rozwoju aplikacji internetowych. W dzisiejszych czasach w chmurze trzymamy coraz więcej danych – poczta, dokumenty, a coraz mniej treści jest przechowywanych na naszych lokalnych dyskach, a coraz więcej streamowanych z sieci. Nadal jednak wszystkie media uploadowane na wszelakie strony trzeba odpowiednio „obrobić”. Zdjęcia pomniejszych i zoptymalizować. Filmy przekonwertować na format odpowiedni dla sieci Web, utworzyć miniaturkę. Coraz częściej treści tego typu trzymane są na wszelkiego rodzaju CDNach – np Amazon S3.
A narzędzie, które mam zamiar dzisiaj opisać, realizuje wszystkie wymienione funkcje za nas. A jego nazwa to Transloadit.
Otóż to, transload.it to narzędzie służące do wszelkiego rodzaju konwersji materiału graficznego na inny format, udostępniające proste API oparte na JSONie. Metody API nazywane są w ramach systemu robotami, a na obecną chwilę jest ich 6. Oto one:
Kanał ATOM
ffmpeg, gdzie przekazujemy parametry bezpośrednio do enkodera) bądź wybierać z gotowych presetów: m.in: webm, flash czy też iphone-high.
Bardzo prosto. Otóż to, w parametrze action naszego formularza ustawiamy adres http://api2.transloadit.com/assemblies, ewentualnie dodajemy plugin jQuery do pokazywania postępu ładowania, a w specjalnym parametrze formularza przekazujemy instrukcje dla robotów (możemy je zdefiniować bezpośrednio, albo podać tylko tzw/ template_id, czyli identyfikator formularza znajdującego się na serwerze). Przykładowy zestaw poleceń prezentuje się następująco:
{
"steps":{
"encode":{
"use": ":original",
"robot": "/video/encode",
"preset": "iphone"
"width": 320,
"height": 240
},
"thumbs":{
"use": ":original",
"robot": "/video/thumbs",
"count": 4
},
"export":{
"use": ["encode", "thumbs"],
"robot": "/s3/store",
"bucket": "your-bucket",
"key": "your-key",
"secret": "your-secret"
}
}
}Po załadowaniu pliku wykonane zostaną następujące czynności:
:original)A co się dzieje w momencie, kiedy nie mam konta na Amazonie? Jak pobrać moje pliki?
Po zakończeniu konwersji w odpowiedzi informacje w JSONie, a tam między innymi URL do efektów pracy narzędzia. Jest on aktywny przez kilka godzin – cytując dokumentację:
The url where you can access this file. This is either a url to your S3 bucket, or a temporary url on one of our servers. Temporary urls will expire after a few hours, so you need to make sure to move your files elsewhere if you aren’t using a storage robot.
Prawda że proste?
Tytuł może być nieco mylący, ponieważ krótkie opisanie Bouce, wbrew pozorom nie jest łatwe. Czym jest Bounce? Jest to aplikacja online, która pozwala nanosić na wskazaną stronę internetową uwagi w postaci kolorowej ramki wraz z opisem w chmurce. Dzięki temu narzędziu w kilka chwil jesteśmy w stanie przesłać dowolne uwagi do dowolnej strony.
Jak to działa? Najpierw podajemy adres strony, którą chcemy opisać, następnie przy pomocy myszki zaznaczamy obszar, który chcemy opisać i na koniec wpisujemy nasz komentarz do chmurki. Chwilę później mamy gotowy link, który możemy wysłać autorowi strony. Jeśli z jakiegoś powodu nie możemy podać adresu strony, istnieje możliwość uploadowania obrazka, który chcemy w jakiś sposób opisać.
Aplikację znajdziecie pod adresem www.bounceapp.com.
Każdy serwis wymagający dużej ilości grafiki na stronie jest zmorą “hostodawcy”. Źle zoptymalizowane grafiki pożerają transfer w zastraszającym tempie. Dobrym przykładem będzie tutaj trójwymiarowy dzbanek z wpisu Animacje 3D przy użyciu CSS3. W chwili obecnej zajmuje on 25 KB. Niby niewiele, ale co jeśli takich obrazków miałbym na stronie kilkanaście/kilkadziesiąt? Przy założeniu, że strona byłaby popularna, marnowałbym niepotrzebnie transfer.
Na szczęście deweloperzy z Yahoo! wyszli na przeciw naszym potrzebom i stworzyli narzędzie o nazwie Smush.it. Jest to prosta z pozoru aplikacja online, kompresująca wskazane grafiki. W przypadku wspomnianego dzbanka, plik po kompresji waży tylko 20 KB, czyli 20% mniej. Dla większej ilości obrazków na stronie oszczędności mogą ilość w megabajty.
Jak to działa? Do Smush.it uploadujemy obrazki lub wskazujemy ich adresy online. Narzędzie przy pomocy kilku innych działających w tle, usuwa zbędne bajty z obrazka, nie zmieniając przy tym jego wyglądu ani jakości. Po zakończonej operacji otrzymujemy listę zoptymalizowanych grafik wraz z opisem poczynionych oszczędności oraz linkiem do pobrania. Sprawdzone – działa.
