December 2007 - Posts
Analog clock is very cool feature, most windows users like analog clocks, we can find them in Google-Gadgets and other desktop programs. I've written custom control a few years ago (in .Net 1.1) and rediscovered it two weeks ago in some of my projects. It is very simple (can be extended and improved) and provides clear example how to build custom controls in .Net (C#).
Challenge for those who moved to WPF: if you have some time and motivation, please write analog clock in WPF and publish the code (you can send it to my email or post in your Blog), developer that will provide working clock in WPF will get cool "Merit Certificate" in my Blog and the appreciation of the developers' community :)
This how it looks in VS Designer (you can see both analog and digital styles) :
I've made custom control "ClockControl" what overrides "OnPaint" method for drawing of clock.
"ClockControl" uses very simple trigonometry functions to calculate the positions of clock hands according to current time. Developer can drag and drop this component from VS tool bar into form or other control container. Each clock property can be accessed from property panel.
|
|
Each small movement of hand is calculated by:
Seconds: 360 / 60 = 6 deg.
Minutes: 360 / 60 = 6 deg.
Hours: 360 / 12 = 30 deg.
|
|
|
Point (X1, Y1) is known point (0, 0) in axes coordinates and (Width/2, Height/2) in control coordinates.
Point (X2, Y2) should be calculated by using the angle of hand according to PC clock.
(See calculations in "Draw…" methods)
|
Class definition table: 
|
Member Name |
Comments |
|
ClockEnabled
(Boolean) |
Enables the timer of the clock, each tick moves hands (redraws the control) |
|
ClockInterval
(Integer)
|
Timer interval in milliseconds |
|
ColorSeconds
(Color)
|
The color of seconds' hand |
|
ColorHours
(Color)
|
The color of hours' hand |
|
ColorMinutes
(Color)
|
The color of minutes' hand |
|
Radius
(Integer)
|
The radius of clock circle |
|
Style
(Enum)
|
Defines current style of the clock |
|
SwitchStyleOnDoubleClick
(Boolean) |
Flag for double-click option to switch clock style between analog and digital display |
|
Time
(Date)
|
Current time |
|
DrawAnalog
(void) |
Draws analog clock graphics, calls methods: DrawSeconds, DrawMinutes, DrawHours, DrawClockCircle, DrawCaptions |
|
DrawDigital
(void)
|
Draws digits of digital clock |
|
GetX
(Integer) |
Returns 'x' coordinate by given radius and angle (see description) |
|
GetY
(Integer) |
Returns 'y' coordinate by given radius and angle (see description) |
|
InitClock
(void) |
Initializes the instance of the control |
|
InitGrafix
(void) |
Initializes pens, brushes and other graphic objects for drawing |
|
SetDrawingStyle
(void) |
Sets custom drawing style parameters |
|
ClockTick
(delTime) |
Event that raised by clock on each timer's tick (very useful for external use) |
Comments about class members (and nested sub-types) of the class:
|
Member (Type) Name |
Comments |
|
/// <summary>
/// Clock Style
/// </summary>
public enum ClockStyle
{
/// <summary>
/// Analog Style
/// </summary>
Analog,
/// <summary>
/// Digital Style
/// </summary>
Digital
} |
(Enum) Represents the clock styles
|
|
/// <summary>
/// Sets the drawing style.
/// </summary>
private void SetDrawingStyle()
{
SetStyle(ControlStyles.UserPaint, true);
SetStyle(ControlStyles.AllPaintingInWmPaint, true);
SetStyle(ControlStyles.DoubleBuffer, true);
SetStyle(ControlStyles.OptimizedDoubleBuffer, true);
SetStyle(ControlStyles.SupportsTransparentBackColor, true);
UpdateStyles();
} |
Method "SetStyle": built-in method of inherited control (base class) to define the drawing parameters.
Flag "UserPaint": control paints itself rather than the operating system (means that "OnPaint" will be called rather, required for double-buffering (prevents flickering) and required by "AllPaintingInWmPaint" flag.
Flag "AllPaintingInWmPaint": control ignores the window message WM_ERASEBKGND to reduce flicker, requires "UserPaint" flag. Disables redundant redrawing of parent background.
Flag "DoubleBuffer": prevents flicker caused by the redrawing of the control (hidden in .Net 2.0, but can be defined by using "DoubleBuffer = true" set), requires "AllPaintingInWmPaint" flag.
Flag "OptimizedDoubleBuffer": control is first drawn to a buffer rather than directly to the screen, which can reduce flicker, requires "AllPaintingInWmPaint" flag.
Flag "SupportsTransparentBackColor": control accepts a BackColor with an alpha component of less than 255 to simulate transparency (means that you can make clock with transparent background!). |
|
/// <summary>
/// Inits the grafix.
/// </summary>
private void InitGrafix(bool _invalidate)
{
if (Bounds.IsEmpty || !IsHandleCreated) return;
// 1. set clock radius (by width or height)
if (Width < Height)
Radius = (int) Math.Round(Width/2.0);
else
Radius = (int) Math.Round(Height/2.0);
// 2. set control region (drawing surface)
using (GraphicsPath p = new GraphicsPath())
{
p.StartFigure();
if (style == ClockStyle.Analog)
p.AddEllipse(ClientRectangle);
else
p.AddRectangle(ClientRectangle);
p.CloseAllFigures();
if (Region != null) Region.Dispose();
Region = new Region(p);
}
// 3. set caption (numbers) font
if (capFont != null) capFont.Dispose();
capFont = new Font(Font.FontFamily, radius * FONT_DIFF_ANALOG, Font.Style);
// 4. set digits font (used by digital style)
if (digFont != null) digFont.Dispose();
digFont = new Font(Font.FontFamily, Height * FONT_DIFF_DIGITAL, Font.Style);
// 5. initialize pens
InitPens();
// 6. set clock boundaries
clockBounds = new Rectangle(1, 1, radius*2 - 2, radius*2 - 2);
capSize = CreateGraphics().MeasureString("0", capFont);
// 7. if user redraw is required
if (_invalidate && IsHandleCreated && !Disposing)
{
Update();
Invalidate();
}
} |
Method "InitGrafix" - initializes graphic variables.
1. Set clock radius by difference between the height and width of the control.
2. Set control surface (region) by clock style (analog = ellipse, digital = rectangle).
"GraphicsPath" object is used to define the shape of the region.
3. Set caption font for analog style by using the selected font of the control.
4. Set caption font for digital style by using the selected font of the control.
5. Initialize pens (objects used to draw clock hands, see method "InitPens").
6. Set clock boundaries (shape rectangle) to draw circle with.
7. If argument "_invalidate = TRUE" invalidate (redraw) clock.
|
|
/// <summary>
/// Inits the pens.
/// </summary>
private void InitPens()
{
InitPen(ref secPen, ColorSeconds, PEN_DIFF_SECONDS);
InitPen(ref minPen, ColorMinutes, PEN_DIFF_MINUTES);
InitPen(ref hourPen, ColorHours, PEN_DIFF_HOURES);
}
/// <summary>
/// Inits the pen.
/// </summary>
/// <param name="_pen">The pen.</param>
/// <param name="_clr">The pen color.</param>
/// <param name="_diff">The width diff.</param>
private void InitPen(ref Pen _pen, Color _clr, float _diff)
{
if (_pen != null) _pen.Dispose();
_pen = new Pen(_clr, _diff);
} |
Method "InitPens" initializes 3 pens by calling "InitPen", passing reference to "Pen" object, color and pen width.
Method "InitPen" called from other places also, can be used as general method for pen initialization. |
|
/// <summary>
/// Raises the <see cref="E:System.Windows.Forms.Control.Paint"></see> event.
/// </summary>
/// <param name="e">A <see cref="T:System.Windows.Forms.PaintEventArgs"></see> that contains the event data.</param>
protected override void OnPaint(PaintEventArgs e)
{
base.OnPaint(e);
if (!Visible || !Created || e == null || e.Graphics == null || e.ClipRectangle.IsEmpty) return;
e.Graphics.Flush(FlushIntention.Sync);
e.Graphics.SmoothingMode = SmoothingMode.AntiAlias;
e.Graphics.TextRenderingHint = TextRenderingHint.ClearTypeGridFit;
if (style == ClockStyle.Analog)
DrawAnalog(e.Graphics);
else
DrawDigital(e.Graphics);
} |
Method "OnPaint" overrides base virtual method from control class. Used to draw clock hands, digits and circle.
I'm using "PaintEventArgs e" to get access to drawing object/device that has access to Windows API to draw my graphics by using GDI+ (see previous post about the GDI Engine).
(a) e.Graphics.Flush(FlushIntention.Sync): Specifies that all graphics operations on the stack are executed as soon as possible (means the previous drawing will be cleared before new one will drawn).
(b) e.Graphics.SmoothingMode = SmoothingMode.AntiAlias: Specifies anti-alias rendering of drawn hands and circle.
(c) e.Graphics.TextRenderingHint = TextRenderingHint.ClearTypeGridFit: Each character is drawn using its glyph ClearType bitmap with hinting. The highest quality setting (meand that all drawn captions will be draw by using high quality rendering with anti-alias like in windows.
(d) "DrawAnalog" or "DrawDigital": called by clock style. |
|
/// <summary>
/// Draws the analog style.
/// </summary>
/// <param name="g">The g.</param>
private void DrawAnalog(Graphics g)
{
DrawSeconds(g);
DrawMinutes(g);
DrawHours(g);
DrawClockCircle(g);
DrawCaptions(g);
} |
Method "DrawAnalog" called to draw analog style graphics.
Calls for other methods to draw different parts of the clock. |
|
/// <summary>
/// Draws the clock circle.
/// </summary>
/// <param name="g">The g.</param>
private void DrawClockCircle(Graphics g)
{
if (g == null || secPen == null || clockBounds.IsEmpty) return;
g.DrawArc(secPen, clockBounds, 0.0f, 360.0f);
} |
Method "DrawClockCircle" draws arc from 0 degree to 360 degree, uses "DrawArc" method with defined pen "secPen", can be replced with "DrawEllipse" that draws ellipse without specification of degrees.
Values "0.0f" and "360.0f" can be replaced with other angles to draw partial arc. |
|
/// <summary>
/// Gets the Y cord.
/// </summary>
/// <param name="_radius">The _radius.</param>
/// <param name="_angle">The _angle.</param>
/// <returns></returns>
public static int GetY(int _radius, float _angle)
{
return (int) Math.Round(_radius*Math.Sin(_angle));
}
/// <summary>
/// Gets the X cord.
/// </summary>
/// <param name="_radius">The _radius.</param>
/// <param name="_angle">The _angle.</param>
/// <returns></returns>
public static int GetX(int _radius, float _angle)
{
return (int) Math.Round(_radius*Math.Cos(_angle));
} |
Static function "GetY" returns calculated value for 'y' coordinate, 'y' axe calculated by sine of angle.
Static function "GetX" returns calculated value for 'x' coordinate, 'x' axe calculated by cosine of angle.
Both functions are defined "static" for access beyond the instance of "ClockControl" and can be used by other classes also.
_radius: the radius of the clock circle
_angle: current angle of hand (in radians) |
|
/// <summary>
/// Draws the seconds.
/// </summary>
/// <param name="g">The g.</param>
private void DrawSeconds(Graphics g)
{
if (g == null || secPen == null || clockBounds.IsEmpty) return;
float angle = (float) (Math.PI*(6.0f*sec - 90.0f)/180.0f);
int y = GetY(radius, angle);
int x = GetX(radius, angle);
Point start = new Point(radius, radius);
Point end = new Point(radius + x, radius + y);
g.DrawLine(secPen, start, end);
} |
float angle = (float) (Math.PI*(6.0f*sec - 90.0f)/180.0f); // calculates the angle of seconds' hand (converts degrees into radians)
int y = GetY(radius, angle); // gets 'y' coord.
int x = GetX(radius, angle); // gets 'x' coord.
Point start = new Point(radius, radius); // point (X1, Y1) = half width and half height of the control or = radius of the clock
Point end = new Point(radius + x, radius + y); // calculated point (X2, Y2), according to current seconds |
|
/// <summary>
/// Draws the minutes.
/// </summary>
/// <param name="g">The g.</param>
private void DrawMinutes(Graphics g)
{
if (g == null || minPen == null || clockBounds.IsEmpty) return;
float angle = (float) (Math.PI*(6.0f*min - 90.0f)/180.0f);
int y = (int) Math.Round(GetY(radius, angle)*0.8);
int x = (int) Math.Round(GetX(radius, angle)*0.8);
Point start = new Point(radius, radius);
Point end = new Point(radius + x, radius + y);
g.DrawLine(minPen, start, end);
} |
float angle = (float) (Math.PI*(6.0f*min - 90.0f)/180.0f); // calculates the angle of minutes' hand (converts degrees into radians)
int y = (int) Math.Round(GetY(radius, angle)*0.8); // gets 'y' coord.
int x = (int) Math.Round(GetX(radius, angle)*0.8); // gets 'x' coord.
(minutes hand is about 80% length of seconds hand)
Point start = new Point(radius, radius); // point (X1, Y1) = half width and half height of the control or = radius of the clock
Point end = new Point(radius + x, radius + y); // calculated point (X2, Y2), according to current seconds |
|
/// <summary>
/// Draws the hours.
/// </summary>
/// <param name="g">The g.</param>
private void DrawHours(Graphics g)
{
if (g == null || hourPen == null || clockBounds.IsEmpty) return;
float angle = (float) (Math.PI*(30.0f*hour - 90.0f)/180.0f);
int y = (int) Math.Round(GetY(radius, angle)*0.6);
int x = (int) Math.Round(GetX(radius, angle)*0.6);
Point start = new Point(radius, radius);
Point end = new Point(radius + x, radius + y);
g.DrawLine(hourPen, start, end);
} |
float angle = (float) (Math.PI*(30.0f*hour - 90.0f)/180.0f); // calculates the angle of hours' hand (converts degrees into radians)
int y = (int) Math.Round(GetY(radius, angle)*0.6); // gets 'y' coord.
int x = (int) Math.Round(GetX(radius, angle)*0.6); // gets 'x' coord.
(hours hand is about 60% length of seconds hand)
Point start = new Point(radius, radius); // point (X1, Y1) = half width and half height of the control or = radius of the clock
Point end = new Point(radius + x, radius + y); // calculated point (X2, Y2), according to current seconds |
|
/// <summary>
/// Draws the captions.
/// </summary>
/// <param name="g">The g.</param>
private void DrawCaptions(Graphics g)
{
if (g == null || capFont == null || clockBounds.IsEmpty || capSize.IsEmpty) return;
using (SolidBrush b = new SolidBrush(ColorCaptions))
{
g.DrawString("0", capFont, b, radius - capSize.Width/2, 1f);
g.DrawString("3", capFont, b, radius*2 - capSize.Width, radius - capSize.Height/2);
g.DrawString("6", capFont, b, radius - capSize.Width/2, radius*2 - capSize.Height + 1);
g.DrawString("9", capFont, b, 0f, radius - capSize.Height/2);
}
} |
using (SolidBrush b = new SolidBrush(ColorCaptions)) // declares solid brush object for drawing of captions, "using" keyword will promise auto-disposing of "b" variable
g.DrawString("any text/digit", capFont, b, radius - capSize.Width/2, 1f); // each digit will be drawn in specific place relative to control bounds |
|
/// <summary>
/// Draws the digital style.
/// </summary>
/// <param name="g">The g.</param>
private void DrawDigital(Graphics g)
{
if (g == null || digFont == null || clockBounds.IsEmpty) return;
string str = DateTime.Now.ToLongTimeString();
using(Brush shadow = new SolidBrush(ColorCaptions))
g.DrawString(str, digFont, shadow, -2f, -2f);
using(Brush text = new SolidBrush(ControlPaint.LightLight(ColorCaptions)))
g.DrawString(str, digFont, text, -1f, -1f);
} |
g.DrawString(str, digFont, shadow, -2f, -2f); // draws digits' shadow (2 padding left-top behind the text)
g.DrawString(str, digFont, text, -1f, -1f); // draws digits above the shadow (with correction of 1 pixel) |
|
/// <summary>
/// Handles the Tick event of the timer1 control.
/// </summary>
/// <param name="sender">The source of the event.</param>
/// <param name="e">The <see cref="System.EventArgs"/> instance containing the event data.</param>
private void timer1_Tick(object sender, EventArgs e)
{
ClockEnabled = false;
DateTime _time = DateTime.Now;
hour = _time.Hour;
min = _time.Minute;
sec = _time.Second;
milli = _time.Millisecond;
if (radius < 1 || secPen == null || minPen == null || hourPen == null || capFont == null || digFont == null)
InitGrafix(false);
Invalidate();
if (ClockTick != null)
ClockTick(hour, min, sec, milli);
ClockEnabled = true;
} |
Method "timer1_Tick" is raised by "Tick" event of timer. Tick-interval can be control thru property "ClockInterval".
Each tick sets hour, minutes and seconds values for clock hands.
ClockEnabled = false; // very crucial, if assignment process takes more then tick interval the execution of this method may cause stack-overflow (means that we stop timer at beginning of method and start it again at the end)
If some of graphic object is NULL or requires some initialization method calls to "InitGrafix" without invalidation of control.
After all parameters are set and checked for initialization method calls "Invalidate" method to redraw the clock surface.
If "ClockTick" event is attached to some event handle it will be called. |
This control is very simple in everyday use, can be extended with new properties like: additional captions "1", "2", "4", "5", "7", "8", "10", "11", existing trigonometric method can be used to calculate theirs positions; new properties like "hand width" can be added also, gradient background with glow like in Google-Gadgets; digital clock can be improved too. Control can be used as visual timer like "System.Windows.Forms.Timer".
Source code (zipped C# project) can be downloaded from here.
Any comments and code for WPF-Clock will be accepted with a big smile :)
I have been driving (legally) for ages and ages One would think I would have noticed the little secret on my dash that was staring me right in the face the whole time. I didn’t and I bet you probably haven’t either.
Quick question - what side of your car is your gas tank? If you are anything like me, you probably can’t remember right away. My solution is to uncomfortably stick my head out the window, strain my neck and look. If you don’t do this in your own car you definitely have done it in a borrowed or rental car. Well ladies and gentlemen, I’m going to share with you my little secret so you will no longer look like Ace Ventura on your way to the gas station or put your neck at risk of uncomfort or injury. If you look at your gas gauge, you will see a small icon of a gas pump. The handle of the gas pump will extend out on either the left or right side of the pump. If your tank is on the left, the handle will be on the left. If your tank is on the right, the handle will be on the right (see photo above). It is that simple! I don’t know how you feel right now but when I found out this morning I felt cheated! Why don’t the dealers share such important information with car buyers? I don’t understand why this isn’t in the drivers ed manual? I don’t get why any mechanic I have ever been too or know has even thought of mentioning this to me? The only possible explanation can be that all these people probably don’t even know! Go out and share the world’s best kept auto secret with your friends as this is information is way too important to be kept secret.
(copied from http://www.see.com.au/blog/?p=2050)
>> In this case developer can't say to client: "R.F.M." :)
לפני שאציג את הדוגמא, ברצוני להציג קטע מתוך ספר שמאוד אהבתי:
Windows Presentation Foundation Unleashed
By Adam Nathan
"In movies and on TV, the main characters are typically an exaggeration of the people you encounter in real life. They're more attractive, they react quicker, and they somehow always know exactly what to do. The same could be said about the software they use. This first struck me back in 1994 when watching the movie Disclosure, starring Michael Douglas, Demi Moore, and an email program that looks nothing like Microsoft Outlook! Throughout the movie, we're treated to various visual features of the program: a spinning three-dimensional "e," messages that unfold when you open them and crumple when you delete them, hints of inking support, and slick animations when you print messages. (The email program isn't even the most unrealistic software in the movie. I'll just say "virtual reality database" and leave it at that.) Usability issues aside, Hollywood has been telling us for a long time that software in the real world isn't as compelling as it should be. You can probably think of several examples on your own of TV shows and movies with comically unrealistic software. But real-world software is starting to catch up to Hollywood's standards! You can already see it in traditional operating systems (such as Mac OS and more recently Windows Vista), in software for devices such as TiVo or Xbox, and on the Web thanks to Adobe Flash. Users have increasing expectations for the experience of using software, and companies are spending a great deal of time and money on user interfaces that differentiate themselves from the competition. ..."
- לפי דעתי אדם (הכותב של הספר) מביא בצורה טובה את המצב שמתחיל לקרות היום בתחום UI: "הוליווד מתחיל לחדור לשולחן העבודה שלנו (המחשב)".
בהמשך לפוסט אחרון "פשוט = יותר טוב!" מתוך סדרת פוסטים על UI, אני רוצה להציג מספר קטעים קצרים מתוך סרט אנימציה "גארפילד בעולם האמיתי". קטעים אלה מציגים שימוש ב-UI במהלך ההפעלה של אולפן סרטים ועריכה של סרט (קומיקס). כפי שהזכרתי בפוסטים הקודמים, UI - בעיניי זהו ממשק "אדם-מכונה" וסרט אנימציה זה מביא דוגמאות טובות למימוש של UI תוך כדי יישום של סיסמא "פשוט = יותר טוב!".
איליי (טכנאי) מפעיל "סט פארק":
- כאן ניתן לראות שאיליי (טכנאי) מפעיל כפתור "סט פארק" על המקלדת היעודית (על השולחן בחדר שידור/עריכה). כמו במפעלים (למשל מפעל לייצור מוצרים ממתכת) טכנאי מפעיל מכונה ע"י לחיצה על כפתור מסויים וכתוצאה מתרחשת סדרה של פעולות, עבודת המשתמש הנה מינימלית, לעומת התוצאה - הרכבה אוטומטית של "סט פארק" תוך כדי שימוש בכלים (במה, תפאורה, תאורה ועוד) הנחוצים.
איליי (טכנאי) מפעיל "סט מטבח" ו-"סט רכבת":
- כאן ניתן לראות בנייה אוטומטית של סטים שונים. לחיצה אחת קטנה = תוצאה גדולה.
בטי עורכת קומיקס:
- בטי עורכת קומיקס ע"י שימוש במחשב עם מקלדת מיוחדת (מאוד מופשטת) הכוללת סט כפתורים בסיסי הנחוץ לפעולות עריכה של הקומיקס.
בטי (עורכת הקומיקס) קוראת לאיליי באינטרקום:
- קטע מעצבן במיוחד (אולי בגלל הקול של בטי)... אנשים משתמשים בטכנולוגיה ללא צורך, "כי זה די מגניב"... כמה מאיתנו קנו מוצרים שלא נזקקו להם, כי היה צורך למלא סיפוק מיידי לרכוש גאג'ט מגניב.
איליי (טכנאי) מכין את אולם התצוגה למעקב אחרי העיתון בו מודפס הקומיקס:
- מודגם שימוש במקלדת היעודית (UI של שולחן שידור). ניתן לראות שמקלדת מכילה סט בסיסי של כפתורי הפעלה (בדומה למקלדת של בטי) וכל כפתור מתאים למשימה ספציפית.
האם UI שהצגתי כאן הוא פשוט (פרימיטיבי) מדי? לפי דעתי "פשוט = יותר טוב!", העבודה היומיומית של הדמויות המצויירות כאן הנה קלה אודות ל-UI שרואים כאן. ממשק משתמש אשר קל להפעלה יכול לעשות חיים של המשתמשים קלים יותר, לחסוך זמן יקר ולמנוע טעויות הפעלה שלפעמים יכולות לגרום לאבידות ברכוש ובחיי האדם (או בעלי החיים). מצד שני אין לזלזל ביכולות המשתמשים, כמעט כל מוצר מותאם לאוכלוסיה מסויימת; רובנו מפתחים UI ללקוח (מגזר) ספציפי (לא כולם מיקרוסופט עם מוצרי מדף כמו וורד).
בכנס MS Dev. Academy II ד"ר יעקב גרינשפן נתן הרצאה מסכמת על WPF ואמר בערך כך: "משתמש טירון יהפוך פעם למשתמש מנוסה"... - בהמון מקרים משתמש יהיה הרבה יותר מנוסה בשימוש במוצר (במקרה שלנו בתוכנה) מאשר מפתח המוצר. חוויתי זאת על בשרי: אנשים עושים שימוש בתוכנות שפיתחתי לצורכיהם בצורה שלא הייתי מעלה בדעתי (בקטע חיובי), אנו מספקים כלי ומשתמש יעשה בו שימוש בהתאם לכשרונותיו. בסרט מודגמים כלים די פשוטים ולפי דעתי משתמש מנוסה אשר ירצה להרכיב שימוש בכלים האלה יהיה מוגבל, כל כפתור משוייך מבחינה פונקציונאלית לתחום מסויים ("סט מטבח" למשל). אבל, זה טוב למפתחים - לקוח רוצה תוספות (הכסף הוא בתחזוקה), כפתור שיפעיל סט נוסף - אין בעיה פיצ'ר (כפתור) חדש בתוספת מחיר. הכל עניין של "באיזה צד אתה...".
פיתוח UI עניין לגמרי לא פשוט, מציאת איזון בין מורכבות פונקציונאלית לבין פשטות ההפעלה הוא קסם שהכנתו דורשת מאמצים רבים ומיומנות.
In last days I experience some annoying and frustrating bug in MS Visual Studio 2005 (at work and at home). I write some project in VB.Net, this project is included in solution that contains another ten projects, that written in VB and C#. In the middle of work with IDE I receive error message: "Microsoft(R) Visual Basic Compiler has encountered a problem and needs to close. We are sorry for the inconvenience", and IDE crushes.
I made quick search in MSDN and found that this is known bug and MS provides some fixes (patches). For some reason I can't handle with installation of these patches. When I try to execute the EXE of the patch I get some unclear message: "This patch package could not be opened. Verify that the patch package exists and that you can access it, or contact the application vendor to verify that this is a valid Windows installer patch package", and setup closes. I've reinstalled the "Windows Installer" - didn't help.
Error messages from VB.Net IDE:
Shown when I typed something in VB:
Details of the error report (contents' log doesn't say anything to me):
If I continue to work after this error was shown, IDE looses intellisence and crahes soon...
Error message before the IDE crashes:
Hot-Fix links from MSDN: http://support.microsoft.com/kb/915038, http://support.microsoft.com/kb/917452.
When I open patch files (VS80-KB917452-X86-ENU.exe or VS80-KB915038-X86-ENU.exe):
I've googled for this kind of bug, some programmers met it and uses fixes and some programmers couldn't solve the problem and reinstalled the VS; I really don't want to reinstall the entire VS2005.
Maybe someone met this bug in VS2005 and can help? Please advice, thanks.
זהו פוסט המשך לפוסט הקודם "מהפכה ב-UI" מתוך סדרת פוסטים על UI.כתבתי בפוסט הקודם על המהפכה הגדולה בממשקי אדם-מכונה בשנים האחרונות, נתתי סקירה קצרה על השינויים בממשקים של מוצרים וסיפרתי סיפור אישי על החוויה של שימוש במוצר מתקדם עם ממשק הפעלה מסובך.
(אפשר לקרוא את הפוסט הזה גם ללא קשר לפוסטים הקודמים)
UI - פוסט 5: Simple IS Better
(פשוט = יותר טוב)
פשוט = יותר טוב! - סיסמא מאוד חזקה בכל תחום חיינו, במיוחד אם מדובר בעיצוב ממשקי אדם-מכונה.
מוצר פשוט אינו בהכרח מוצר דל מאפיינים, הכוונה כאן למוצר אשר פשוט לשימוש ע"י בן אדם ממוצע, ז"א מוצר "נגיש".
לקוחות רוצים לקבל יותר בפחות כסף, אך למעשה רובם אינם יודעים מה הם רוצים באמת. אם ניקח לדוגמא את מוצרי האלקטרוניקה הבידורית או תקשורת, ניתן לומר ששני התחומים מאוד קשורים ואף משולבים באותם מכשירים אלקטרוניים כמו טלפונים סלולאריים. כיום תעשייה מייצרת ביקוש ע"י פרסום ושווק אגרסיבי, בהמון מקרים מייצרים מוצר חדש או משכללים קיים בתכונות חדשות. צצים מוצרי צריכה שנקראים בשפת הנוער "מגניבים", כולם רוצים את המוצרים האלה, אך לא יודעים האם ישתמשו בהם או בחלק הגדול מהתכונות שלהם.
יצירת מוצר משוכלל עם המון תכונות משולבות אינה משימה פשוטה. לאחר שמצליחים לדחוס טכנולוגיות שונות לתוך מוצר אחד יש לדאוג שיהיה לו ממשק הפעלה נוח. אם נקח לדוגמא מכשיר טלפון סלולרי, בדורות האחרונים יש כ"כ הרבה תכונות ויכולות, בעבר מחשבים שולחניים לא היו מצוידים בהם או לא יכלו להריץ יישומים שהיום רצים בתוך הטלפון. הבעיה היא שלרוב המכשירים יש ממשקי הפעלה מסובכים, למשל קיימת תכונה שהיינו רוצים להשתמש בה, אבל מסתבר שהיא מאוד קשה להפעלה, או שאנו לא מודאים לקיומה בתוך המכשיר, כוון שנדרשים המון דפדופים (או מעברים) בתוך התוכנה של המכשיר, אם נרצה להשתמש בה.
לאחרונה חל שינוי תפיסתי בעיצוב ממשקי אדם-מכונה. ממשק, זהו למעשה מתווך המשמש לתקשורת עם המכונה, בין אם מדובר בכפתורי הפעלה של שואב אבק, טלפון או תוכנת מחשב.
מקצוע של מעצב תעשייתי נהיה מאוד מבוקש. בעבר בחלק גדול מהתעשיות עיצוב המוצר נעשה ע"י מהנדסים שפיתחו את הליבה הטכנולוגית של המוצר. לאותם המהנדסים מוצרים אלה נראו פשוטים להפעלה, אבל עבור משתמש ממוצע היו מסורבלים ומפחידים. עיצוב מוצרים הנם אומנות ומדע יחד. מדע, כי נורמות העיצוב מוגדרות על בסיס מחקרי ועל סמך היבטים מדעיים כמו פיסיקה, כימיה, ארגונומיה ועוד. אומנות, כי עיצוב בהגדרתו זו יצירה בעלת טעם, יופי ואופי.
"פשוט, זה יותר טוב!" על מנת לקרב מוצר לסיסמא זו, יש להשקיע לא מעט זמן ומשאבים. צריך לשאוף לפתח מוצר מתקדם, אבל הוא צריך להיות נוח לשימוש. זה מצריך שילוב של מהנדסים, מעצבים ועוד אנשי מקצוע רבים. לא כל חברה יכולה להרשות לעצמה העסקה של כל אלה, אך יכולה להשתמש בשיטות וטכנולוגיות שעוזרות לעצב מוצר מתקדם ופשוט כאחד.
PS
פרסמתי פוסט (עם דוגמאות) כהרחבה לפוסט זה - קישור לפוסט.
ראו בהמשך פוסט על "MS Framework 3.0", אשמח לקבל הערות/תיקונים לגבי הפוסט. לרשימת הפוסטים של הסדרה לחצו כאן.
זהו פוסט המשך לפוסט הקודם "OpenGL vs. DirectX" מתוך סדרת פוסטים על UI. פוסט הקודם נתן סקירה קצרה על מנועי תלת-מימד, בוצעה השוואה בין מספר תכונות המנועים וסופר על ייחודיותם.
(אפשר לקרוא את הפוסט הזה גם ללא קשר לפוסטים הקודמים)
UI - פוסט 4: מהפכה ב-UI
(ולא רק במחשבים)
אם נסקור התפתחויות של מוצרים שאנו משתמשים בהם (החל ממוצרי אלקטרוניקה כמו מקלטי-וידאו, טלוויזיות, מחשבים ועד מכוניות, מטוסים ואוניות), אז נגלה שההתקדמות הטכנולוגית של המוצרים האלה התרחשה במהירות גבוהה יותר במהלך עשרים שנים האחרונות, מאשר בשנים שלפני כן. כל דור של מוצרים מתקדם בתכונותיו ובמאפייניו.
לפני שאמשיך אספר סיפור אישי:
מכשיר וידאו ביתי
- מאז שנות השמונים של המאה העשרים מכשיר זה נהיה חלק בלתי נפרד מהטלוויזיה בסלון. עם השנים, מכשיר וידאו שוכלל, השתפר באיכותו וקיבל תכונות חדשות בנוסף לאלו שכבר היו בדורותיו הקודמים. (שיפורים חלו בעיקר באיכות ואורך ההקלטה, נוספו תכונות חדשות כמו תכנות זמן תחילת ההקלטה וקליטה של הרבה ערוצים ה-Hyper-bend). אני זוכר שלקראת סוף שנות התשעים קנינו מכשיר וידאו שלישי שלנו (שהיה מתקדם בהרבה מקודמיו) בעל יכולות חדשות ומגוונות. מכשיר הגיע עם שישה ראשי הקלטה (זה אפשר לבצע הקלטות של המון שעות על קסטות תקניות), היה לו היפרבנד משופר, תמך בפורמטים שונים של שידור, בעל יכולת תכנות (היה ניתן לכוונו להקלטה אוטומטית בזמן מוגדר) ועוד תכונות רבות, אם אמשיך לפרט אצטרך לוותר על יתר הנושאים.
- כל זה היה נהדר. אני כתלמיד חרוץ הקדשתי יומיים לקריאת ספר ההדרכה העבה שלו. אבל... על אף כל היכולות והשכלולים, הוא היה צעצוע יקר, מיותר וגם מיותם. כעבור מספר ימים אף אחד כבר לא השתמש בו. מהנדסים שתכננו אותו כנראה חשבו שמי שהולך להשתמש בו אלה דוקטורים לאלקטרוניקה יישומית שעובדים ב-NASA. רק מהסתכלות על השלט שלו אפשר היה לקבל סחרחורת, השלט נראה כמו דגם מוקטן של תא טייס של מטוס בוינג-747 או חדר בקרה של כור גרעיני. היו עליו עשרות כפתורים בגווני אפור, הכפתור PLAY היה מוסתר היטב בין יתר כפתורי הפעלה הזעירים (כנראה לאנשים בארץ הייצור של המכשיר יש אצבעות קטנות מאוד). בבית, אף אחד חוץ ממני לא העז להתקרב אל המכשיר (שני הוריי לא באים מתחום המחשבים או אלקטרוניקה או כל תחום שבו אין פחד מולד בהפעלת כורים גרעינים קטנים ואחי היה די קטן ולא התעניין במכשיר). כל הפעלה של מכשיר מצד הוריי דרשה התערבותי ואם פעולה דרשה יותר מניגון קלטת קיימת, אז היה צורך להצטייד בספר ההדרכה העבה שהגיעה עם המכשיר. גם התפריטים של הוידיאו שראינו על המסך לא היו מובנים כ"כ ונראו כמו ממשקים גראפיים של חלליות מסרטי מדע בדיוני של שנות השמונים.
בקיצור, המכשיר היה משוכלל, אך מסובך להפעלה, היה מצויד בהמון תכונות נפלאות שאף משתמש ביתי לא היה זקוק להן, הפעלתו דרשה ידע טכני וכל ממשק ההפעלה (החל מהשלט ועד הכפתורים על המכשיר עצמו) היה מאוד מסובך.
אחזור לנושא...
לכל דור מאז ומעולם היה פחד בפני קדמה (מסוג כלשהו), אנשים חששו מהמהפכה תעשייתית של המאה ה-19, אותן החששות היו גם במאה העשרים (סרט מפורסם של צ'ארלי צ'אפלין "זמנים מודרניים" של 1936 - דוגמא טובה לכך), האנשים חוששים גם במאה ה-21 (כן, גם מפתחי תוכנה), כל דור חווה את הפחד בפני קדמה טכנולוגית כלשהי (ההשתלטות של הרובוטים ועוד). זוהי עובדה, שאנשים מבוגרים נוטים להתנגד יותר לחידושים הטכנולוגיים מאשר דור צעיר יותר. זוהי עובדה פיזיולוגית, המוח האנושי מזדקן וכושר הלמידה יורד. ללא קשר לגיל, האבולוציה האנושית, במובן הפיזיולוגי לא התקדמה הרבה. בן-אדם לא קיבל כוחות-על יחד עם קדמה (אף חתכים גדולים של אוכלוסיה הפסידו יכולות פיזיולוגיות שהיו בדורות הקודמים), יחד עם קדמה הגיעו מחלות הקשורות אליה, בהתאם לסוג העיסוק של האנשים. היכולות הפיזיולוגיות והקוגניטיביות לא התפתחו מאז אדם הקדמון.
יחד עם זאת ידע אנושי צבר תאוצה, מדור לדור אנו צוברים ובעבירים ידע שלא היה בדורות הקודמים, התקדמנו בכלים שאני משתמשים כיום, בתחום המחייה (מגורים), תקשורת, תחבורה ועוד.
מצאו את ההבדלים:
אין ספק שלא מספיק לפתח מוצר מתקדם, יש גם לדאוג ל"הנגשת" המוצר ללקוח (או למגזר הייעודי).
"הנגשה" - התאמה של כלי לקהל היעד (בין אם הוא מוחשי או לא). אם נחזור לדוגמא קודמת עם וידאו-טייפ, אז היום הוא הוחלף בנגן DVD או במקלט DVD, מכשיר יותר מתקדם עם תכונות מרובות, אבל עם ממשק יותר נגיש.
המהפכה בממשקי אדם-מכונה נגעה בהמון תחומים. למשל בתחום הרכב: הוכנסו המון רכיבים אלקטרוניים הקשורים לנהיגה, תקשורת, נווט ובידור. אם נשווה dashboard (לוח בקרה עם מחוונים) של רכב עם כל החידושים מסוף שנות התשעים ל- dashboard של רכב של שנות האלפיים אז נגלה שבשנות האלפיים הוא נהיה יותר פשוט, אבל זה לא אומר שהוא נהיה פחות מתקדם; הוא נעשה יותר נגיש, פשוט ובטיחותי.
דוגמא נוספת זה תא-טייס: בין אם מדובר במטוסים צבאיים או אזרחיים. הציוד במטוסים השתכלל עם השנים, הטייס מקבל המון מידע (חזותי וקולי), המצב הגיע לכך שעל הטייס היה כ"כ הרבה עומס של מידע שזה הפך לסיכון בטיחותי. לאחרונה החלה מהפכה גם בתא הטייס, הוא עובר שינויים של הנגשה (שינויים בממשקי אדם-מכונה).
התקדמות בתחום המחשוב והיקף השימוש הביא לנו מחשבים עם תוכנות בעלות ממשקים מסובכים להפעלה. יחד עם התפתחותה של יכולת תצוגה הגראפית, קיבלנו הזדמנות לשפר ממשקים של התוכנות, פישוט הממשק של התוכנה מאפשר חדירה של המחשב לאוכלוסיות שהתקשו בעבר בהפעלתו.
בתחום הבידור (כהמשך לדוגמא של מכשיר וידאו): ההתפתחות בתחום מכשירי הבידור הביאה למזעורם ולדחיסה של המון טכנולוגיות לתוך מכשירים קטנים. אם לא היו מפתחים ממשקים פשוטים ונוחים אז ההפעלה של מכשירים אלה הייתה מסובכת (ניתן לציין שעדיין יש מכשירים מסובכים להפעלה למשתמש הממוצע).
תחום התקשרות (בייחוד תקשורת סלולארית) עבר תהפוכות גרנדיוזיות ועל כך יהיה פוסט מיוחד.
ראו בהמשך פוסט על "פשוט = יותר טוב!", אשמח לקבל הערות/תיקונים לגבי הפוסט. לרשימת הפוסטים של הסדרה לחצו כאן.
אני מתחיל סדרת פוסטים על ממשקי משתמש במחשבים ועל כל הנוגע ל-UI. יהיו פוסטים שיעסקו בסקירות היסטוריות וטכנולוגיות ויהיו פוסטים (שאנו המפתחים מאוד אוהבים) שנכנסים לקוד ולפיתוח GUI. כמו כן אסקור טכנולוגיות חדשות שעוזרות לפתח ממשקי משתמש. מקווה שיהיה מעניין וקולע :)
UI - פוסט 1: ממשקי מחשב בעשרים שנים האחרונות
בעשרים שנים האחרונות הייתה התפתחות מואצת של מחשבים; ניתן לציין שהייתה התפתחות טכנולוגית גדולה גם ביתר התחומים. תוכנות נועדו לשרת אנשים, ללא קשר לסוגיהן או ליעודן. חלק גדול מן התוכנות מופעל ע"י אנשים וקיימת אינטראקציה (פעולה הדדית) בין תוכנת מחשב והאדם. בעשרים שנים האחרונות הייתה התקדמות בתחום המחשוב, הן בתחום החומרה והן בתחום התוכנה; שני התחומים מושפעים אחד מן השני. למשל: פיתוח תוכנה נעשה בהתאם למגבלות החומרה ולהיפך - התפתחות החומרה גורמת להתפתחות ביכולות התוכנה, גם התפתחות התוכנה גורמת להאצת התפתחות החומרה ...
UI - פוסט 2: Swing vs. GDI
על מנת לקבל מידע מהמכונה (כאן, מחשב) או להזין מידע למכונה יש להשתמש בהתקני קלט-פלט, במקרה שלנו - מסך מחשב. מסך מחשב - LCD או CRT, מציג מידע ויזואלי (CRT בעזרת קרן קתודית-מגנטית על גבי האלקטרודות או ע"י שינוי של צבע הקריסטלים נוזליים ב-LCD). אלקטרודה או קריסטל (גביש) הנם יחידות חומרה קטנות ביותר לתצוגה של נקודה אחת בצבע כלשהו (לא אתייחס לטכניקות הקרנה שונות בשלב זה). מכאן ניתן לומר שהצגת מידה מתבצעת ע"י ציור מיליוני נקודות (פיקסלים) על המסך ...
UI פוסט 3: OpenGL vs. DirectX
בהמשך לנושא הקודם שנגע במנועים גראפיים כמו GDI ו-Swing, אגע במנועים גראפיים נוספים, שעובדים בטכנולוגיות DirectX ו-OpenGL. כפי שמנועי GDI או Swing נועדו ל"ציור" של אובייקטים גראפיים דו-ממדיים (בעיקר פקדים של טפסים וכו'), DirectX ו-OpenGL נועדו ל"ציור" אובייקטים גראפיים דו-ממדיים ותלת-ממדיים (מדמים אפקט של תלת מימד בעזרת טרנספורמציות גראפיות של צורות דו-ממדיות על המסך, על כך יפורט בהמשך) ...
UI - פוסט 4: מהפכה ב-UI
(ולא רק במחשבים)
אם נסקור התפתחויות של מוצרים שאנו משתמשים בהם (החל ממוצרי אלקטרוניקה כמו מקלטי-וידאו, טלוויזיות, מחשבים ועד מכוניות, מטוסים ואוניות), אז נגלה שההתקדמות הטכנולוגית של המוצרים האלה התרחשה במהירות גבוהה יותר במהלך עשרים שנים האחרונות, מאשר בשנים שלפני כן. כל דור של מוצרים מתקדם בתכונותיו ובמאפייניו ...
UI - פוסט 5: Simple IS Better
(פשוט = יותר טוב)
פשוט = יותר טוב! - סיסמא מאוד חזקה בכל תחום חיינו, במיוחד אם מדובר בעיצוב ממשקי אדם-מכונה.
מוצר פשוט אינו בהכרח מוצר דל מאפיינים, הכוונה כאן למוצר אשר פשוט לשימוש ע"י בן אדם ממוצע, ז"א מוצר "נגיש".
לקוחות רוצים לקבל יותר בפחות כסף, אך למעשה רובם אינם יודעים מה הם רוצים באמת ...
UI פוסט 6: מבוא ל- MS Framework 3.0
חבילה של .NET Framework (שם לא רשמי: WinFX), מכילה סטים של "קוד מנוהל" - API והנה חלק אינטגראלי של מערכת הפעלה של מיקרוסופט - Windows Vista ושל Windows Server 2008. ניתן להתקינה גם על Windows XP עם חבילת שירות SP2 ועל Windows Server 2003. חבילה זו באה אחרי חבילה של דוט-נט 2.0 ומכילה מספר שינויים מבניים ומגיעה על ...
UI פוסט 7: מבוא ל- Windows Presentation Foundation
Windows Presentation Foundation - WPF, שם לא רשמי - Avalon - הנה תת חבילה של .Net Framework 3.0 (שם לא רשמי: WinFX). תת חבילה זו מובנית במערכת הפעלה חדשה של מיקרוסופט בשם "Vista"; בנוסף יכולה להיות מותקנת כרכיב שדרוג במערכות הפעלה Windows XP/2003. תת-חבילה מספקת מודל פיתוח עקבי לאפליקציות חלונאיות ואינטרנטיות; מודל זה מהווה הפרדה ברורה בין שכבת ממשק משתמש (UI) ושכבה עסקית/מידע (Business Logic). אפליקציות שמפותחות ב-WPF יכולות "לרוץ" בסביבה חלונאית (שולחן עבודה) או בסביבה אינטרנטית (כאפליקציה בתוך אתר WEB). חבילה זו מספקת מגוון אפשרויות עיצוב של פקדים ואלמנטים גראפיים ...
UI - פוסט 8: מבוא למתודולוגיה בפיתוח ממשקי משתמש
עבר מול הווה: בשנים האחרונות חלו מספר שינויים במתודולוגיית פיתוח של תוכנה. גובשו מספר מודלים/שיטות של פיתוח ופותחו תבניות שמספקות פתרונות לרוב הבעיות בפיתוח התוכנה. אציין מספר תחומים שבהם חל שינוי תפיסתי בשנים האחרונות: (לפני שאכנס לנושא הממשקים אני רוצה לתת סקירה קצרה על ההתפתחות בשיטות הפיתוח/תכנות) תכנות מודולארי ← תכנות מונחה עצמים : בעשרים שנים האחרונות חל מעבר משיטת פיתוח פרוצדוראלית (מודולארית) לשיטת פיתוח בתכנות מונחה עצמים; לשיטה האחרונה יתרונות בולטים על פני הראשונה ...
UI - פוסט 9: מתודולוגיה בפיתוח ממשקי משתמש - שיטות בהנדסת תוכנה: פיתוח תוכנה במודל השכבות
אחת השיטות של פיתוח תוכנה שמאוד נפוצה בשנים האחרונות היא "מודל השכבות". לדוגמא: מודל OSI - שבע שכבות בתקשורת מחשבים. מודל זה מוכר בשמות "רב שכבתי" (Multitier Architecture) או N-שכבתי (N-Tier), או תלת-שכבתי (ראו דוגמאות בהמשך). מודל השכבות הוא מודל ארכיטקטוני מקובל לתיאור הרכיבים השונים במערכות המידע. חבילות פיתוח שונות של ארכיטקטורה כמו דוט-נט, ג'אווה ואחרים; מגדירות דרכים שונות לייצוג הרכיבים השונים במערכות מידע. מודל השכבות הוא פשוט יחסית ומטרתו איננה לייצר דרך לבניית ארכיטקטורת מידע ארגונית
...
UI - פוסט 10: מתודולוגיה בפיתוח ממשקי משתמש - שיטות בהנדסת תוכנה: מעצב vs. מפתח
בפיתוח מוצר יש להתחשב במספר גורמים מכריעים, חלק מהם: קהל היעד (למי נועד המוצר), פונקציונאליות, נגישות ושמישות. לדוגמא מכשיר טלפון סלולארי: כיום טלפונים ניידים כוללים המון תכונות ובעלי יכולות רבות. חוץ מיכולת העברת השמע (שזו אמורה להיות המטרה המרכזית שלו) הוא מצויד ברכיבים כמו מודם סלולארי, מערכת ניווט לווינית, ספר טלפונים, פנקס, מחשבון, מצלמה, נגן מדיה, מקלט רדיו, דפדפן אינטרנט ועוד תכונות רבות. לפני עשור לא היינו מדמיינים שכל זה היה ניתן להכניס לגוף הקטן של הטלפון הנייד. הבעיה בפיתוח מוצר כזה - זה לבנות ממשק פונקציונאלי, אך נוח לשימוש עבור המשתמשים שעבורם נועד המכשיר ...
UI - פוסט 11: מתודולוגיה בפיתוח ממשקי משתמש - אפקט WOW
עיצוב מוכר - לעיצוב המוצר חלק חשוב בהצלחת השיווק שלו, בין אם זה טנק או מוצר צריכה המוני. כיום עיצוב המוצר נעשה תוך מתן דגש על הפיכת המוצר למושך יותר ושיווקי יותר, כל זאת בנוסף להתמקדות בצדדים הטכניים והנדסיים של המוצר. תפקיד של מעצב תעשייתי הנו משמעותי, מושג "סקסי" כיום מיוחס גם למוצרי הצריכה שבעבר לא היינו מעלים בדעתנו לקרוא להם כך ...
UI - פוסט 12: טכנולוגיות תצוגת ממשק משתמש
כאשר מחשבים חוברו למסכים נוצרו מספר טכנולוגיות לתצוגת מידע טקסטואלי על גבי המסך. מסכי מחשב עד אמצע שנות התשעים היו בעצם מסכי טלויזיה (CRT) ללא היפרבנד (hyperbend - רכיב אלקטרוני המסוגל לאחסן בזיכרון מספר רב של הערוצים עפ"י נתונים שונים, כמו תדר, עוצמה וכו'). באמצע שנות התשעים (יחד עם התפתחות של מחשבים ניידים) החלה חדירה של מסכים בטכנולוגיה שמבוססת על גבישים נוזליים (בדומה ל- LCD).
- שפופרת קרן קתודית, היא מתמר המשמש במסכי צפייה, וממיר אותות חשמליים לתמונה. ממציאה היה קרל פרדיננד בראון, אשר בנה שק"ק לראשונה עוד ב-1897.
מסכי שק"ק נמצאים בשימוש נרחב בטלוויזיות ...
UI - פוסט 13: סקירה של שיטות נפוצות להחלקת גופנים
ראסטריזציה פשוטה, ללא החלקה: זהוי צורה הכי בסיסית של ראסטריזציה, ציור פשוט של קוי התווים ללא החלקה מסוג כלשהו. שיטה זו הכי מהירה (כי זה דורש פחות חישובים למיקום הטקסט על המסך). גישה זו בעלת חיסרון, כאשר מדובר בפונטים קטנים, חלק מן התווים יהיה קשה לזהות. מספר גדול של גופנים (בעיקר מסוג True-Type או Script) כוללים בתוכם אזורי תווים עם "רמזים" שעוזרים למערכת ראסטר להחליט איכן הם המקומות הבעייתיים בתצוגה של פונטים קטנים, כאן ייעשה שימוש בחלופות כמו תמונות קטנות (small bitmaps) של אותם תווים בעייתיים (גופנים שבנויים מתמונות בד"כ משתייכים ל- system fonts) ...
UI - פוסט 14: שני אלגוריתמים פשוטים להחלקת גופנים
האלגוריתם הפשוט להחלקת הגופנים: שיטה: Gamma smoothing, כאן ניתן לראות תיאור גראפי של פעולת הוספה של פיקסלים לצדי פיקסל המטרה
...
אלגוריתם להחלקת גופנים: שיטת 2 הצעדים:
- סריקה בכוון מוגדר מראש
- שימוש בשלשה זקיפים
- זקיף שמאלי, אמצעי וימיני
- סריקה בשני צעדים עד פיקסל מטרה
- זקיף שמאלי או ימני קובעים כוון הדגשה בצעד השני ...
UI - פוסט 15: כלים לפיתוח תוכנה וממשקי משתמש - מבוא
ה-"דינוזאורים" של כלי פיתוח: שפות תכנות ראשונות (ברמה של שפת-על) פותחו בשנות השישים של המאה העשרים, יחד איתן פותחו גם המהדרים (קומפיילרים) הראשונים.
מתוך ויקיפדיה: מהדר (באנגלית Compiler) הוא תוכנית מחשב המתרגמת בין שפת מחשב אחת לשפת מחשב אחרת. המהדר הקלאסי מקבל כקלט תוכנית הכתובה בשפה עילית ומתרגם אותה לתוכנית בשפת מכונה. מהדר תואם בדרך כלל לסוג מעבד מסוים בלבד, ולגירסת שפה מסוימת, ותוצריו לא יהיו תואמים למעבד אחר. פעולתו של המהדר קרויה הידור...
המשך יבוא ...
Technorati Tags:
UI,
UX,
Graphics
זהו פוסט המשך לפוסט הקודם "Swing vs GDI" שעסק בסקירה של מנועים גראפיים של מערכות הפעלה. כמו כן הראתי טבלת השוואה קטנה בין שני המנועיים.
(אפשר לקרוא את הפוסט הזה גם ללא קשר לפוסטים הקודמים)
UI פוסט 3: OpenGL vs. DirectX
בהמשך לנושא הקודם שנגע במנועים גראפיים כמו GDI ו-Swing, אגע במנועים גראפיים נוספים, שעובדים בטכנולוגיות DirectX ו-OpenGL.
כפי שמנועי GDI או Swing נועדו ל"ציור" של אובייקטים גראפיים דו-ממדיים (בעיקר פקדים של טפסים וכו'), DirectX ו-OpenGL נועדו ל"ציור" אובייקטים גראפיים דו-ממדיים ותלת-ממדיים (מדמים אפקט של תלת מימד בעזרת טרנספורמציות גראפיות של צורות דו-ממדיות על המסך, על כך יפורט בהמשך).
קצת היסטוריה:
בעולם האנושי התקשרות החזותית מתבצעת ע"י פירוש (אינטרפרטציה) של צורות, לרוב הצורות הנם אובייקטים תלת-ממדיים מוחשיים, כגון: חפצים, אנשים ובעלי חיים; בעלי ממדים בעולם האמיתי. המוח האנושי מתרגם אותות שהוא מקבל מהעיניים לתמונות בהתייחסות למיקום החפץ במרחב, פרמטרים נוספים: חוזק האור (תאורה), צבעים, צללים ועוד רבים אחרים. האדם המודרני מבטא את המחשבה החזותית בצורת תמונות ועל מנת להציג חפצים תלת-ממדיים הוא המציא שיטות שונות כמו ציור בפרספקטיבה, הצללות, שינוי צבעים ועוד.
עם ההתפתחות של המחשבים, התפתחו גם התקנים שמסוגלים להציג מידע חזותי כמו: טקסטים ותמונות. בחלק מן ההתקנים האלה נכללים כרטיסים גראפיים (כרטיסי מסך); כרטיסים אלקטרוניים משוכללים אשר מותקנים במארז המחשב, כרטיסים אלה מספקים יכולת "ציור" של מידע חזותי על גבי המסך. בשנים האחרונות חלה התפתחות גדולה בהתקנים אלה וכיום הם מציידים ברכיבי זיכרון עצמאיים, מעבדים מתמטיים ורכיבים מיוחדים נוספים. אם בעבר חלק גדול מהחישובים של המידע חזותי נעשה ע"י ה-CPU (מעבד ראשי של המחשב), אז היום זה מתבצע בכרטיס גראפי, רוב הכרטיסים החדשים מציידים במעבד ייחודי אשר "מתמחה" ביכולות חישוב של תצוגות תלת-ממדיות. כרטיס מכיל מעבד גראפי, אשר נשלט ע"י התוכנה (דרייבר), תוכנה מקבלת פקודות על מנת להציג אובייקטים תלת-ממדיים על גבי המסך, לכל אובייקט ישנם פרמטרים כמו: גודל, צורה, צבע, גוון, טקסטורה ועוד.
מפתחי תוכנה משתמשים בדרייבר על מנת להפעיל את הכרטיס. עבודה עם דרייבר של חומרה אינה קלה, לכל יצרן יש דרייבר עם ממשק API שונה (לאחרונה נעשים מאמצים לקבוע סטנדרטים קבועים לכל היצרנים הגדולים), יש להכיר את מגוון הפקודות של הממשק, הפקודות יחסית מסובכות לשימוש, בד"כ מפתח שמגיע מתחום של תכנות בשפות-העל והעולם של תכנות מונחה עצמים לא "יאהב" את ה-API של החומרה. - כאן בא לעזרה מנוע גראפי תלת-ממדי, ש"מתווך" בין מפתח תוכנה לבין הדרייבר של החומרה.
מנוע גראפי - מהווה שכבה לוגית (שכבה של תוכנה) מעל דרייבר של החומרה (במקרה שלנו - כרטיס גראפי). שכבה של מנוע גראפי מכילה ממשק עם פקודות, שבעזרתן ניתן לשלוט בדרייבר של רכיב החומרה. מנוע גראפי הנו מתווך (Proxy) בין הממשק של הדרייבר לבין השכבת התצוגה של היישום. מנוע גראפי "מכיר" פקודות ספציפיות של כל יצרן החומרה, מספק ממשק נוח ואחיד לכל פלטפורמה שעליה הוא מותקן.
לדוגמא: אני מעוניין לפתח מחשק מחשב תלת-ממדי. לשם כך אני זקוק לכרטיס גראפי בעל יכולות עיבוד מסוימות, בשוק המחשבים קיימים מגוון כרטיסים גראפיים ולכל כרטיס יש ממשק ומאפיינים ייחודיים. אני מעוניין שהמשחק יוכל לעבוד עם כל הסוגים הנפוצים של כרטיסים גראפיים - בעיקר שהוא יספק לי יכולות גראפיות נחוצות. המטרה היא לפתח משחק מחשב ללא קשר לסוג החומרה שעליה המשתמש ירצה להפעיל את המשחק. מנוע גראפי יהווה ממשק API שמולו אני אעבוד, עליו אפתח את הצד הגראפי של המשחק, ומנוע יתרגם את הפקודות לאלו המובנות לדרייבר החומרה.
לסיכום: מנוע גראפי מהווה חוצץ לוגי בין המפתח לדרייבר חומרה, מפתח לא צריך להכיר את הממשקים ואת הפקודות שמפעילות את החומרה, למעשה הוא תמיד עובד מול אותו ממשק שמוכר לו. היצרן של כרטיס גראפי מתאים את הממשק של הדרייבר לדרישות של מנוע גראפי, או לחילופין היצרן של המנוע הגראפי מתאים את המנוע לסוג החומרה עליה הוא אמור לשלוט.
מנוע גראפי לתלת-ממד
תיאור חזותי של אובייקטים תלת ממדיים מתבצע בעזרת חומרה מיוחדת ו/או בעזרת תוכנה מיוחדת.
בעבר הלא רחוק החלו להתפתח תוכנות עם יכולת תצוגה של אובייקטים תלת-ממדים, חלק גדול מהתוכנות הללו שייך למשחקי מחשב. חברות תוכנה שייצרו משחקים פיתחו מנועים גראפיים משלהם ועם השנים חלק מהן עברו לפיתוח של מנועיים גראפיים בלבד, כמוצר עיקרי; אותו הן משווקות לחברות אחרות המפתחות תוכנות בעלות יכולת תצוגה תלת-ממדית.
כיום ישנם שני מנועים גראפיים דומיננטיים בשוק התוכנה:
OpenGL
מתוך האתר ויקיפדיה:
- OpenGL (Open Graphics Library) הוא ממשק תכנות יישומים ליצירת תוכנות שמייצרות גרפיקה תלת ממדית ממוחשבת (וגם דו-ממדית). הממשק מורכב מיותר מ-250 קריאות פונקציות שונות שיכולות לשמש לציור של סצנות תלת-ממדיות מורכבות מפרימיטיבים (אובייקטים) פשוטים. OpenGL פותחה ע"י חברת סיליקון גרפיקס (Silicon Graphics Inc.) בשנת 1992 והיא פופולארית בתעשיית משחקי הוידיאו, שם היא מתחרה בפלטפורמות של חברת מיקרוסופט המשתמשות ב־Direct3D. שימוש נרחב ב-OpenGL ניתן למצוא בסביבות מציאות מדומה, סימולציות מדעיות, הצגת מידע, סימולאטורים מדמי טיסה ופיתוח משחקי מחשב.
- בנוסף ניתן לציין כי ממשק OpenGL שייך לחבילת פיתוח (SDK - Software development kit) אשר מופצת בחינם ויש גרסאות שונות להתקנה במערכות הפעלה שונות, ניתן לומר שזהו מנוע גראפי רב-תחליטי עבור פלטפורמות (מע' הפעלה) שונות.
DirectX
מתוך האתר ויקיפדיה:
- DirectX היא ספרייה (DLL - Dynamic link library) שפותחה על ידי מיקרוסופט לסביבת Windows, מטרתה לתת גישה ישירה לחומרת המחשב, ובכך להאיץ ביצועים. מטרה נוספת של ספרייה זו היא להנגיש למתכנתים פונקציות לגרפיקה דו ממדית ותלת ממדית, מבלי שיעברו התמחות מיוחדת בכך. הוספת ספרייה זו גרמה לכך שפיתוח משחקי מחשב למשל יהיה קל ומהיר מאשר קודם.
בחלק מן המקורות DirectX מוזכר יחד עם Direct3D:
Direct3D
- מהווה רכיב מרכזי של DirectX האחראי על רינדור (עיבוד והצגה נכונה) של תלת-מימד. הטכנולוגיה משתמשת בהאצת חומרה (כרטיס הגראפי).
- כמו OpenGL, DirectX הנה חבילת פיתוח (SDK) שמופצת בחינם, לעומת OpenGL חבילה זו יכולה "לרוץ" רק במערכות הפעלה של מיקרוסופט (ללא קשר לניסיונות של קהילות מפתחים בקוד-פתוח, להתאים חבילה למערכות הפעלה אחרות כמו לינוקס. הרצה של משחק הבנוי על חבילה הנ"ל דרך אימולטור כלשהו הנה איטית ומלווה בבעיות ברוב המקרים).
OpenGL vs. DirectX
לשני מנועיים יש מאפיינים משותפים וייחודיים, ולשניהם יש חסרונות ויתרונות:
|
פרמטר השוואה |
DirectX |
OpenGL |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
טבלת השוואות נוספת בתחום הרינדור התלת-ממדי:
Feature OpenGL DirectX
Vertex Blending N/A Yes
Multiple Operating Systems Yes No
Extension Mechanism Yes Yes
Development Multiple member Board Microsoft
Thorough Specification Yes No
Two-sided lighting Yes No
Volume Textures Yes No
Hardware independent Z-buffers Yes No
Accumulation buffers Yes No
Full-screen Ant-aliasing Yes Yes
Motion Blur Yes Yes
Depth of field Yes Yes
Stereo Rendering Yes No
Point-size/line-width attributes Yes No
Picking Yes No
Parametric curves and surfaces Yes No
Cache geometry Display Vertex Buffers
System emulation Hardware not present Let app. determine
Interface Procedure calls COM
Updates Yearly Yearly
Source Code Examples SDK
את הטבלה המקורית אפשר למצוא כאן: http://www.cprogramming.com/tutorial/openglvs.html
ראו בהמשך פוסט על ה"מהפכה ב-UI", אשמח לקבל הערות/תיקונים לגבי הפוסט. לרשימת הפוסטים של הסדרה לחצו כאן.
זהו פוסט המשך לפוסט הקודם "ממשקי מחשב בעשרים שנים האחרונות" מתוך סדרת פוסטים על UI. פוסט הקודם נתן סקירה קצרה וכללית על היסטורייה של ממשקי מחשב ומערכות הפעלה הנפוצות.
(אפשר לקרוא את הפוסט הזה גם ללא קשר לפוסטים הקודמים)
UI - פוסט 2: Swing vs. GDI
על מנת לקבל מידע מהמכונה (כאן, מחשב) או להזין מידע למכונה יש להשתמש בהתקני קלט-פלט, במקרה שלנו - מסך מחשב. מסך מחשב - LCD או CRT, מציג מידע ויזואלי (CRT בעזרת קרן קתודית-מגנטית על גבי האלקטרודות או ע"י שינוי של צבע הקריסטלים נוזליים ב-LCD). אלקטרודה או קריסטל (גביש) הנם יחידות חומרה קטנות ביותר לתצוגה של נקודה אחת בצבע כלשהו (לא אתייחס לטכניקות הקרנה שונות בשלב זה). מכאן ניתן לומר שהצגת מידה מתבצעת ע"י ציור מיליוני נקודות (פיקסלים) על המסך.
GDI
כל מערכת מכילה רכיב תוכנה אשר אחראי "לציור" מידע גראפי (טקסט וסוגי גרפיקה אחרים). רכיב נקרא: GDI - Graphics Design Interface, ממשק עיצוב גראפי. לכל מערכת הפעלה יש מנוע גרפי משלה אשר פותח בהתאם להגדרת השימוש של אותה מערכת הפעלה. ניתן לציין שלחלק מן התוכנות שאינן חלק מובנה של מערכת הפעלה יש מנוע גרפי משלהן, שעובד במקביל למנוע גרפי של מערכת ההפעלה או "מעליו" (אתייחס למינוח זה בהמשך).
ליתר דיוק יש לומר ש"ציור" מתבצע ע"י החומרה - כרטיס מסך. יצרן של כרטיס מסך מספק עימו תוכנה אשר מאפשרת לשלוט בכרטיס - תוכנה נקראת "Driver" (מנהל התקן). מערכת הפעלה משתמשת בדרייבר על מנת להציג מידע גראפי על המסך. רכיב שנמצא מעל הדרייבר (מעל - ז"א מפעיל את הדרייבר - נמצא בשכבה מעליו) הנו GDI.
במערכות הפעלה של מיקרוסופט ואפל יש GDI (לכל חברה יש GDI משלה). מתחילת שנות התשעים של המאה העשרים ועד היום טכנולוגיה לא עברה הרבה שינויים. מנוע "מצייר" אובייקטים גראפיים על מסך המחשב בשיטת ראסטריזציה.
ראסטריזציה - מיפוי סיביות, תרגום מידע מספרי למידע ויזואלי אשר מתורגם לפיקסלים על גבי צג המחשב או קבצים של מפת סיביות (bitmap files). למשל: אם GDI מצייר קו אשר מיוצג בזיכרון המחשב ע"י שתי נקודות (x1,y1)A ו-(x2,y2)B, בעובי של 2 פיקסלים ובצבע שחור; מנוע יצייר את הקו פיקסל אחרי פיקסל מנקודה A ועד נקודה B, לכל פיקסל יינתן צבע שחור ורוחב הקו ייוצג ע"י שני פיקסלים לכל האורך. לסיכום: כל המידע הגראפי שמוצג על המסך מצויר ע"י הפיקסלים.
Swing
זהו מנוע גראפי אשר פותח ע"י חברת Sun ומהווה חלק מחבילת פיתוח של Java. מנוע זה עובד במקביל ל-GDI, ז"א נמצא בשכבה מעל הדרייבר של כרטיס מסך.
קצת היסטוריה:
ג'אווה - שם של שפת תכנות וגם שם של חבילת פיתוח, ניתנת להתקנה ברוב מערכות הפעלה נפוצות. הרעיון שעומד מאחורי הפצתה של החבילה הוא שניתן לפתח תוכנה בשפת ג'אווה ולהריצה במערכות הפעלה שונות, Sun יצרה חבילת פיתוח עבור המפתחים, שיעשו שימוש במחלקות שלה. על מנת להריץ את התוכנה שנכתבה בשפת ג'אווה יש להתקין את החבילה במערכת הפעלה. חבילת פיתוח זו מאפשרת לכתוב תוכנה בתקן אחיד ללא קשר למערכת הפעלה כלשהי (ככה לפחות Sun טוענת).
Swing - (חלק מחבילת (Java מנוע גראפי לציור אובייקטים גראפיים /פקדים, תמונות וכו') של התוכנה. למה Swing? - כוון ש-Java מאפשרת לפתח תוכנה ללא קשר למערכת הפעלה יש לדאוג שהממשקים הגראפיים גם יהיו בלתי תלויים במע' הפעלה, לדוגמא: ניתן לפתח ממשק גראפי (טופס עם פקדים) בסביבת Windows ואח"כ להריץ אץ התוכנה בסביבת Linux. לשתי מערכות הפעלה הנ"ל יש GDI משלהן, אילו לא היה Swing אז היה צורך לפתח ממשק גראפי נפרד לכל מערכת הפעלה.
Swing vs. GDI
לשני מנועיים יש מאפיינים משותפים וייחודיים, ולשניהם יש חסרונות ויתרונות:
|
פרמטר השוואה |
GDI/GDI++ |
Swing |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
הערה: עפ"י סקרים אחרונים, ניתן להגיע למסקנה שהעדפה לשימוש בטכנולוגיה כלשהי נובע בעיקר מנגישות כלי פיתוח; ז"א אם ישנו כלי פיתוח נוח ונגיש לפיתוח ממשק השתמש בטכנולוגיה כלשהי, רוב הסיכויים שהטכנולוגיה זו תהיה דומיננטית יותר.
ראו בהמשך פוסט על "OpenGL vs DirectX", אשמח לקבל הערות/תיקונים לגבי הפוסט. לרשימת הפוסטים של הסדרה לחצו כאן.
אני מתחיל סדרת פוסטים על ממשקי משתמש במחשבים ועל כל הנוגע ל-UI. יהיו פוסטים שיעסקו בסקירות היסטוריות וטכנולוגיות ויהיו פוסטים (שאנו המפתחים מאוד אוהבים) שנכנסים לקוד ולפיתוח GUI. כמו כן אסקור טכנולוגיות חדשות שעוזרות לפתח ממשקי משתמש. מקווה שיהיה מעניין וקולע :)
UI - פוסט 1: ממשקי מחשב בעשרים שנים האחרונות
בעשרים שנים האחרונות הייתה התפתחות מואצת של מחשבים; ניתן לציין שהייתה התפתחות טכנולוגית גדולה גם ביתר התחומים.
תוכנות נועדו לשרת אנשים, ללא קשר לסוגיהן או לייעודן. חלק גדול מן התוכנות מופעל ע"י אנשים וקיימת אינטראקציה (פעולה הדדית) בין תוכנת מחשב והאדם. בעשרים שנים האחרונות הייתה התקדמות בתחום המחשוב, הן בתחום החומרה והן בתחום התוכנה; שני התחומים מושפעים אחד מן השני. למשל: פיתוח תוכנה נעשה בהתאם למגבלות החומרה ולהיפך - התפתחות החומרה גורמת להתפתחות ביכולות התוכנה, גם התפתחות התוכנה גורמת להאצת התפתחות החומרה.
ניתן לחלק מערכות תוכנה לשתי קטגוריות: מערכות עם ממשק משתמש אדם-מכונה ולמערכות ללא ממשק משתמש אדם-מכונה, מערכות כאלה מופעלות ע"י גורמים לא אנושיים - תוכנות אחרות או מכונות. במקרה אחרון ניתן לומר שהכן קיים ממשק משתמש, שמופעל ע"י גורם לא אנושי, ממשק כזה יהיה נחוץ לעבודה עם אותו גורם (כאן, מושג "התממשקות"). פוסט זה יעסוק במערכות שבהן נחוץ ממשק משתמש "אדם-מכונה".
בעשרים שנים אחרונות חלה התפתחות גדולה בתחום מערכות הפעלה במחשבים אישיים, ניתן לציין מספר חברות מסחריות בולטות בתחום: מיקרוסופט, אפל, IBM, Sun ו-Silicon Graphics. בשנות השמונים של המאה העשרים הייתה מהפכה בתחום המחשב האישי, בין החברות הנ"ל היו שלש חברות אשר לקחו חלק מרכזי במהפכה זו: חברת אפל וחברת IBM בשיתוף פעולה עם מיקרוסופט. אפל נכנסה לשוק מערכות הפעלה עם מערכת הפעלה בעלת ממשק גרפי (GUI - Graphical User Interface), לעומתה IBM ומיקרוסופט המשיכו למכור מערכות בעלות ממשקים טקסטואליים עם יכולות גראפיות מעטות. ניתן לציין שמאז ועד היום חברת אפל נשארת מובילה בתחום של עיצוב ממשקים "אדם-מכונה" ולא רק בתחום התוכנה.
לאחר שמיקרוסופט סיימה שיתוף פעולה עם הענקית IBM (אמצע שנות שמונים), פנתה לפיתוח מערכת הפעלה גראפית משלה ובתחילת שנות התשעים הציגה לעולם מערכת הפעלה Windows 1.0 שהתבססה על מערכת הפעלה קיימת - DOS (גם תוצרת מיקרוסופט). במקביל, חברת אפל המשיכה פיתוח מערכת משלה והייתה אז למובילה בתחום מערכות הפעלה עם ממשקים גראפיים שעלו בביצועים וביופי על המערכות של מיקרוסופט.
באמצע שנות התשעים של המאה העשרים, חברת מיקרוסופט הציגה לעולם מערכת הפעלה גראפית (גם מבוססת DOS) - MS Windows '95, מערכת זו הייתה מתקדמת בהרבה ממערכות הפעלה הקודמות של החברה והיה לה יתרון על המערכות של אפל, בכך שהיה ניתן להתקינה על כל מחשב תואם IBM, לעומת מערכת של אפל שחייבת להיות מותקנת אך ורק על החומרה של אפל. - ניתן לציין, שזו הייתה מהפכה בתחום מערכות הפעלה והמחשבים האישיים.
מדוע להעדיף ממשק גראפי על פני ממשק טקסטואלי? - פשוט מאוד, כפתגם עתיק: "תמונה אחת שווה אלף מילים". כמות המידע שניתן להעביר בעזרת תווים (טקסט) הנה קטנה, תיאורים טקסטואליים מאוד מוגבלים. לאחר ההתפתחויות בתחום מערכות הפעלה עם ממשקים גראפיים, החלה חדירה של מחשבים לאוכלוסיות שהייתה להם מגבלה טכנולוגית בשימוש בממשקים טקסטואליים, כעת המשתמש אינו זקוק לידע טכני וליכולות מיוחדות על מנת להפעיל את המחשב. תפריטים נוחים וסמלים אינטואיטיביים מאפשרים הפעלה פשוטה של המחשב.
מאמצע שנות תשעים ועד עכשיו יצאו מספר גרסאות של מערכות הפעלה למחשבים אישיים. כל גרסה חדשה מגיעה עם חידושים טכנולוגיים. ניתן לציין שההתפתחות בתחום המולטימדיה והתקשורת (טלפונים ניידים, נגני מוסיקה ומדיה אחרת) הולידה מערכות הפעלה ייעודיות לתחומים הנ"ל. נכון להיום, עדיין בולטות שתי חברות מסחריות בתחום מערכות הפעלה: אפל ומיקרוסופט. באמצע שנות התשעים נכנסה שחקנית חדשה לתחום מערכות הפעלה: "לינוקס". מדובר במערכת אשר פותחה ע"י סטודנט למדעי מחשב בפינלנד (Linus Torvalds) ולאחר מכן המשך הפיתוח נעשה ע"י קבוצות של מפתחים מתנדבים במסגרת פרויקט "קוד פתוח". רוב גרסאות המערכת מופצות בחינם. נכון להיום מערכת "לינוקס" מהווה מתחרה רציני מול מערכות הפעלה מסחריות.
התפתחויות הטכנולוגיות של מערכות הפעלה כללו התקדמות בתחום UI הן בחלק הגראפי והן במדיה אחרת.
ראו בהמשך פוסט על Swing vs. GDI, אשמח לקבל הערות/תיקונים לגבי הפוסט. לרשימת הפוסטים של הסדרה לחצו כאן.
שמי מקסים אלכסנדרוביץ' וזהו הפוסט הראשון שלי. אני שמח להצטרף לקהילה זו ורוצה לשתף אותכם במה שמעניין אותי. כעת קו"ח שלי בבלוג לא כ"כ מעודכנים, אעדכן אותם בהמשך. תחום ההתעניינות הנוכחי (וגם בעבודתי) הוא ממשקים גראפיים - GUI. בהמשך אפרסם מספר מאמרים שהתחלתי לכתוב לאחרונה בנושא.
